Project setting in Webflow
Overview
Attraverso i Project Settings possiamo impostare funzioni di tipo:
- Generale (nome sito web, acquisto del piano di Hosting)
- Grafico (font, favicon, etc)
- Tecnico (inserimento Google Analytics, pixel di Business Manager - Facebook, etc).
I Project Settings fanno riferimento dalle impostazioni del sito web alla quale stiamo lavorando su Webflow. È bene non confonderli rispetto agli Account Setting che fanno riferimento alle sole impostazioni dell’account e non del sito web di riferimento.
Project Settings - Overview
Anatomia dei Project Settings
Per comprendere meglio la pagina Project Settings, approfondiamo le 10 tab e le sezioni che troviamo all’interno della pagina:
- General
All’interno di questa tab troviamo:
- General Settings:
- Modificare il nome del sito web
- Modificare il nome del sottodominio (Subdomain): nell’ esempio in basso abbiamo inserito “webflowfacile” e il sottodominio sarà: www.webflowfacile.webflow.io
- Inserire il sito web in una cartella specifica per fare ordine nella nostra Dashboard.
Project Settings - Tab General (General Settings)
- Icons (Icone):
- Inserire o modificare la Favicon che vogliamo mostrare nel nostro sito web.
- Inserire o modificare la Webclip che vogliamo mostrare quando un utente scarica il link al nostro sito nel loro smartphone.
Project Settings - Tab General (Icons)
- Localization (localizzazione):
- Possiamo impostare l’ora a cui farà riferimento Webflow. Ad esempio, nel caso in cui volessimo programmare la pubblicazione di un articolo/item nel sito web: l’orario farà riferimento a quanto inserito in questa sezione.
Project Settings - Tab General (Localization)
- Website Password:
- Questa opzione serve per limitare l’accesso alle nostre pagine solo ai possessori della password inserita.
Project Settings - Tab General (Password)
- Una volta inserita la password, tutte le pagine saranno bloccate e visualizzeremo questa schermata.
Questa è la schermata di default che propone Webflow ma è modificabile in tutte le sue parti.
Project Settings - Tab General (Password, Sito-web)
- Made in Webflow:
- Questa impostazione permette di mostrare il nostro sito web nella sezione “Made in Webflow” in webflow.com
Per pubblicare in “Made in Webflow” è necessario, prima, rendere il proprio profilo pubblico.
Project Settings - Tab General (Made in Webflow)
- Webflow Branding:
- Possiamo eliminare il badge “Made in Webflow”. Quando creiamo un sito web, di default, la piattaforma inserirà il badge.
- Possiamo eliminare dal codice sorgente i riferimenti a Webflow.
Project Settings - Tab General (Webflow Branding)
- Overview:
- In questa sezione Webflow ci fornisce delle informazioni importanti come: totale dimensione degli asset caricati, data di pubblicazione, creazione e ultimo aggiornamento, etc.
É una sezione in cui non possiamo prendere azioni.
Project Settings - Tab General (Overview)
- Site Activity:
Questa sezione è utile per tenere traccia di tutte le azioni/modifiche che attuiamo nel nostro sito web.
É una sezione in cui non possiamo prendere azioni ma possiamo monitorare le azioni prese (e attuate) nel nostro sito web.
Project Settings - Tab General (Site Activity)
2. Hosting
- Site Plans:
- In questa sezione possiamo vedere il piano di hosting che abbiamo attivato o che vogliamo attivare nel sito web di riferimento. In Webflow è possibile acquistare l’hosting in base al bisogno che dobbiamo soddisfare. Siti web statici, dinamici ed e-commerce queste sono le principali suddivisioni che troviamo a livello di hosting.
Project Settings - Tab Hosting (Site Plans)
- Custom Domains:
- Da questa impostazione possiamo aggiungere il nostro dominio personalizzato. Ad esempio, se abbiamo appena creato il sito web e vogliamo modificare il sottodominio che troviamo pre-impostato oppure se vogliamo aggiungere altri domini a quelli già acquistati e attivati in precedenza.
Project Settings - Tab Hosting (Custom Domains)
- 301 redirects:
- Grazie a questa impostazione possiamo re-indirizzare un link ad uno nuovo link. Si può utilizzare questa tecnica per non perdere il posizionamento nella SEO.
Project Settings - Tab Hosting (301 Redirects)
- Advanced Publishing Options:
- Troviamo 5 bottoni che permettono di apportare al sito ottimizzazioni in termini di SEO e sicurezza.
Project Settings - Tab Hosting (Advanced Publishing Options)
- Custom SSL certificates:
- Webflow ci permette di modificare il certificato SSL. Per poter far ciò però abbiamo bisogno di un piano Enterprise.
Il certificato SSL è utilizzato nei siti web per proteggere i nostri siti web (i dati sensibili possono essere crittografati), migliorare la SEO, aumentare l’identità del brand.
Project Settings - Tab Hosting (Custom SSL Certificates)
3. Editor
- Collaborators:
- Possiamo gestire l’accesso alla modalità Editor ai soli utenti a cui vogliamo dare autorizzazione per esso.
Project Settings - Tab Editor (Collaborators)
- Branding:
- Quando accediamo all’editor di Webflow troveremo il logo dello stesso. Possiamo cambiarlo attraverso questa impostazione.
Project Settings - Tab Editor (Branding)
4. Plans & Billing
- Billing:
- Billing (in italiano fatturazione), mostrerà lo stato attuale del piano che abbiamo attivato e la relativa fatturazione che abbiamo pagato (piano annuale) o che stiamo pagando (piano mensile.
Inoltre, da questa opzione è possibile cancellare il piano di hosting.
Project Settings - Tab Plans & Billing (Billing)
- Past Invoices:
- Troviamo la lista di tutte le fatture che abbiamo pagato con il relativo importo, data di fattura e il PDF scaricabile della fattura.
Project Settings - Tab Plans & Billing (Past Invoices)
5. SEO
- Indexing:
- Possiamo disabilitare l’indicizzazione del sotto-dominio.
- Possiamo modificare, attraverso l’area di testo fornita da Webflow, solo alcune pagine che NON vogliamo indicizzare.
Project Settings - Tab SEO (Indexing)
- Sitemap:
- Troviamo un opzione che permette di tenere sempre aggiornata la nostra Sitemap, se flaggata in ON. Quando pubblicheremo una nuova pagina questa sarà aggiornata nella nostra URL. Ad esempio se pubblichiamo una nuova pagina su Webflow Facile che parla di patatine fritte, questa sarà, una volta pubblicato il sito web inserita anche nella lista che troviamo in sitemap.xml.
Project Settings - Tab SEO (Sitemap)
- Google Site Verification:
- In questa parte di setting, possiamo agganciare, il nostro sito web con Google Search Console. Quest’ultima è molto importante se vogliamo indicizzare il nostro sito web.
Project Settings - Tab SEO (Google Site Verification)
- Global Canonical Tag URL:
- Il Tag Canonical serve per indicare a Google (ai suoi crawler) che un contenuto di una pagina web è ripetuto in un’altra pagina web del nostro.
Questa impostazione è un tema delicato in termini SEO, ma grazie all’inserimento della URL, possiamo evitare ad esempio che Google indicizzi una URL piuttosto che un’altra (esempio, evita che indicizzi il contenuto parziale rispetto a quello “madre”).
Project Settings - Tab SEO (Global Canonical Tag URL)
6. Forms
- Form Notification:
- In questa sezione possiamo inserire le informazioni per indicare a Webflow a chi inviare i dati dell’utente una volta che ha compilato il form.
- Possiamo anche inserire le informazioni per rispondere in maniera automatica alla mail dell’utente che ha compilato il form.
Project Settings - Tab Forms (Form Notification)
- reCAPTCHA validation:
- Per evitare che bot automatizzati compilino il nostro form, è possibile inserire un bottone di protezione da spam e abusi.
Project Settings - Tab Forms (reCAPTCHA validation)
- Form Integrations:
- Questa impostazione permette di integrare delle piattaforme di marketing automatizzate. Per far ciò abbiamo bisogno di un piano Enterprise.
Project Settings - Tab Forms (Form Integrations)
- Restrict uploaded file access:
- Nel caso in cui carichiamo dei file e vogliamo limitare l'accesso solo agli utenti che si sono loggati nel nostro sito web.
Project Settings - Tab Forms (Restrict uploaded file access)
- Form Submission Data:
- Qui troveremo l’elenco di tutti i form inseriti nel nostro sito web e i relativi dati raccolti.
Project Settings - Tab Forms (Form Submission Data)
7. Fonts
- Google Fonts:
- Possiamo installare i font che troviamo nel sito web fonts.google.com direttamente dal menù a tendina che troviamo in questa schermata.
Project Settings - Tab Fonts (Google Fonts)
- Custom Fonts:
- Se vogliamo caricare i font direttamente nel sito web possiamo farlo da questa sezione attraverso i file TTF, OTF, EOT and WOFF.
Questo eviterà di utilizzare il rendering di Google Font e avere un caricamento della pagina più veloce.
- Installed Fonts, in questa sezione possiamo visualizzare tutti i font caricati nel sito web.
- Fallback for Installed Fonts, questa impostazione comunica al sito web quale font vogliamo caricare in sostituzione del font installato, nel caso quest’ultimo non fosse caricato correttamente.
Project Settings - Tab Fonts (Custom Fonts)
- Adobe Fonts:
- Oltre a Google Fonts, possiamo usufruire di Adobe Fonts. Per far ciò dovremo prima procurarci il nostro API token tramite l’apposito sito di Adobe Fonts.
Project Settings - Tab Fonts (Adobe Fonts)
8. Backups
- Backups:
- Troviamo l’elenco di tutti i backup che la piattaforma ha avviato e salvato per noi.
È possibile visualizzare tutte le versioni di backup salvati prima di ripristinarli.
Project Settings - Tab Backups (Backups)
9. Integrations
- Google Analytics:
- Grazie a questa opzione è possibile collegare il proprio account di Google Analytics, inserendo Universal Analyics Tracking ID fornito da Google.
Project Settings - Tab Integrations (Google Analytics)
- Google Optimize:
- Se vogliamo attivare degli A/B test nelle nostre pagine web, possiamo collegare il nostro account Google Optimize.
Project Settings - Tab Integrations (Google Optimize)
- Google Maps:
- Per collegare una mappa di Google Maps nel sito web, basterà inserire il codice API di Google.
Project Settings - Tab Integrations (Google Maps)
- Facebook Pixel:
- Per monitorare gli utenti atterrati nella tua pagina ed inviare il dato a Facebook, possiamo inserire il pixel fornito da Facebook.
- Importante: per essere conformi alla legge di GDPR dobbiamo flaggare la voce “Delay for cookie consent”. In questo modo il pixel scatterà solo dopo che l’utente avrà dato il proprio consenso.
Project Settings - Tab Integrations (Facebook Pixel)
- API Access:
- Impostazione avanzata, permette di generare un token API che permetterà di accedere al proprio CMS e gestirlo tramite un’applicazione esterna.
Project Settings - Tab Integrations (API Access)
- Webhooks:
- Altra impostazione avanzata, sono i Webhooks. Attraverso il bottone e il popup relativo, potremo gestire la loro impostazione.
Project Settings - Tab Integrations (Webhooks)
10. Custom code
- Head and Footer Code:
- In questa ultima tab possiamo inserire direttamente il nostro codice personalizzato nei tag di Head e Body.
Project Settings - Tab Custom Code (Head Code)
Project Settings - Tab Custom Code (Footer Code)
- Advanced Settings:
- Impostazione avanzata, da questa sezione possiamo specificare l’URL di base da utilizzare per tutti gli URL relativi, come spiegato qui.
Inoltre è possibile impostare un prefisso href che, come indicato da Webflow, permette di mettere assieme il piano di Hosting di Webflow con uno già esistente.
Project Settings - Tab Custom Code (Advanced Settings)
Nella lezione successiva entriamo nelle impostazioni del sito web che Webflow chiama Project Setting. Queste impostazioni ci aiutano a impostare Hosting, SEO, Form e tante altre funzionalità molto importanti per un utilizzo totale di un sito web.
Per andare alla lezione successiva clicca nel bottone in basso.
LEZIONE PRECEDENTE
LEZIONE SUCCESSIVA
