In acest tutorial va aratam cum sa utilizati Bootstrap in Magento 2.
- Descarcati pachetul Bootstrap
In primul rand, trebuie sa determinati ce fisiere vi se va cere sa utilizati atunci cand utilizați boot strap prin .less.
Apoi descarcati pachetul Bootstrap pentru a compila propriile fisiere si a le converti intr-un fisier css dintr-un fisier .less si descarcati pachetul de cod sursa.
- Verificati fisierele descarcate
Extrageti fisierul descarcat, apoi verificati fisierele din folderul Bootstrap.
Apoi, odata ce compilati fisierele .less folosind metoda conventionala prin GRUNT, fisierele compilate se afla in folderul dist. Si acolo, bootstrap.css este urmat de alte versiuni de CSS toate provenind din diferite fisiere .less prezente in folderul less.
- Includeti Bootstrap in tema dvs.
Introduceti comenzile de mai jos in fisierul default.xml a temei dvs.
<head>
<script src="js/bootstrap.min.js"/>
</head>
si
<css src="css/bootstrap.css" />
- Creati si organizati un director pentru structura de fisiere Bootstrap .less
Va trebui sa reveniti la pachetul de cod sursa descarcat la pasul 1 al acestui tutorial.
Copiati folderul less din pachet impreuna cu toate fisierele .less si folderul mixins.
In folderul less stergeti fisierele less
Accesati directorul tematic Magento 2
Lipiti toate fisierele din folderul less, din directorul mixins si fisierele mixins in directorul bootstrap.
Creati un fisier principal boot strap pentru a importa toate fisierele din directorul bootstrap. Fisierul pe care il creati trebuie sa fie in directorul /web/css/ si paralel cu /web/css/bootstrap.
- Compilati fisierele tematice impreuna cu Bootstrap
Daca exista fisiere .less in tema dvs., trebuie sa le compilati pentru a genera fisierele .css corespunzatoare.
HostX ofera cel mai bun hosting Magento si va poate asista in rezolvarea problemelor dvs., oferind servicii de gazduire sigure si de incredere. Contactati-ne pentru a afla cum solutiile noastre de gazduire Magento va pot ajuta in atingerea obiectivelor dvs.
