Indiferent daca utilizati HubSpot pentru a crea landing pages si teme de site-uri pentru clientii dvs. sau pentru a le vinde pe piata HubSpot, puteti gasi mai jos pasii pe care ii parcurg si cum functioneaza intreaga dezvoltare. Unii pasi va trebui sa ii refaceti in mod constant, in timp ce altii (cum ar fi instalarea) vor fi necesari o singura data.
Folosesc foarte mult CLI si developmentul il realizez pe localhost si le incarc prin terminal in contul meu HubSpot. In acest fel, pot folosi editorul meu de cod preferat (sunt fan al Visual Studio Code) si pot sa-mi organizez fisierele si sa le accesez cu usurinta, fara a fi nevoie sa ma conectez la contul meu HubSpot.
Inainte de a incepe
Vei avea nevoie de:
- – un cont de sandbox HubSpot developer
- – npm instalat
- – cunostiinte medii/avansat de HTML, CSS, Javscript/jQuery, HubL (HubSpot scripting language)
- – cunostiinte minime de folosire CLI
Creaza un proiect local
Creati un folder nou in htdocs (folosesc Xampp, dar puteti utiliza Wamp sau Mamp fara probleme) si denumiti-l conform preferintelor tale. Personal utilizez doua foldere, unul pentru clienti si unul pentru dezvoltare personala si mi-am denumit hubspot-clients, dar din nou puteti numi folderul dupa propriile preferinte.
Deschideti terminalul si navigati la folderul nou creat daca doriti sa instalati HubSpot local. Daca doriti sa il instalati la nivel global, faceti-o in folderul radacina (htdocs in xampp).
Instalare Hubspot:
npm install -g @hubspot/cli
Initializati conexiunea dintre localhost si contul de hubspot
hs init
Deschideti hubspot.com pentru a va copia cheia personala de acces? Y/N
Tasteaza Y pentru a trece la pasul urmator.
Introdu cheia personala de acces:
- – selecteaza contul pe care vrei sa il conectezi
- – copiaza Personal CMS Access Key
- – insereaza cheia in terminal
Introduceti un nume unic pentru a face referire la acest cont in CLI:
Am tastat hubspot-clients deoarece acesta este folderul pe care vreau sa-l folosesc.
Un fisier hubspot.config nu va fi disponibil in folderul pe care l-ati creat (in cazul meu: hubspot-clients).
Comenzi HubSpot CLI
Afiseaza toate comenzile CLI:
hs help
Generati autentificare pentru contul dvs. HubSpot
hs auth
Vedeti o lista a conturilor tale HubSpot
hs accounts list
Urcati fisiere, directoare din contul HubSpot si descarcati-le in mediul local
hs fetch --account=<name> <src> [dest]
hs filemanager fetch --account=<name> <src> [dest]
Incarcati fisierele din mediul local in contul HubSpot
hs upload --account=<name> <src> <dest>
hs filemanager upload --account=<name> <src> <dest>
Functia de Watch a fisierelor in timp ce lucrati in mediul local cu incarcare automata
hs watch --account=<name> <src> <dest>
Muta fiserele dintr-un director in altul
hs mv --account=<name> <src> <dest>
Creeaza folderul sau structura de fisiere a unui nou material
hs create <type> <name> [dest]
Fisiere, foldere sterse din contul HubSpot, dar nu din mediul local
hs remove --account=<name> <path>
Creeaza un nou HubDB in contul tau HubSpot
hs hubdb create <src>
Descarca date din tabele HubDB in mediul local
hs hubdb fetch <tableId> <dest>
Lista comenzilor HubSpot CLI este actualizata in mod constant. Puteti gasi o lista completa de comenzi actualizate pe site-ul web HubSpot.
Creaza o tema Hubspot
Cand rulati comanda de mai jos, veti crea o noua tema care va fi populata cu tema centrala HubSpot.
Redenumiti my-website-theme cu numele temei dorite.
hs create website-theme my-website-theme
In prezent, tema rezida in mediul local. Pentru a incarca tema in contul HubSpot, executati comanda de mai jos. Asigurati-va ca inlocuiti my-website-theme cu numele alocat din comanda de mai jos.
hs upload my-website-theme my-website-theme
Succes! Tema este incarcata in contul dvs. HubSpot si sunteti gata sa creati pagini de site web si pagini de destinatie.
Structura temei standard HubSpot:
- – css
- – images
- – js
- – modules
- – sections
- – templates
- – fields.json
- – licence.txt
- – theme.json
Puteti incepe sa editati aceste fisiere si sa creati noi sabloane, sectiuni si module.
Urmariti, deoarece voi adauga in mod constant articole despre tema si dezvoltarea modulelor in HubSpot.
Happy Coding!