Vai al contenuto principale
Tutte le collezioniFeedlinkProdotto e caratteristiche
Come personalizzare la tua pagina Feedlink utilizzando CSS personalizzati
Come personalizzare la tua pagina Feedlink utilizzando CSS personalizzati
Teo avatar
Scritto da Teo
Aggiornato più di un anno fa

In questo articolo condivideremo le modifiche CSS più comuni che puoi utilizzare per personalizzare la tua pagina Feedlink.

L'idea con l'opzione CSS personalizzato è quella di darti una flessibilità totale per assicurarti che il design dei feed dei social media si adatti al branding e al layout del tuo sito web.

Se vuoi dare un'occhiata più da vicino o sperimentare con il codice, puoi farlo utilizzando la funzione "Ispeziona" nel tuo browser web. Questo ti permetterà di vedere quali classi CSS vengono utilizzate su diversi elementi della pagina.

Se non hai ancora un account Feedlink, fai clic per iniziare una prova gratuita di 7 giorni.

Per iniziare, segui questi passaggi:

Fatto! Hai ora aggiunto con successo il CSS personalizzato alla tua pagina Feedlink.

Diamo uno sguardo alle diverse classi CSS che puoi utilizzare per stilizzare la tua pagina.

Blocco bio

La classe CSS per cambiare il blocco bio è .profile-section-container

Icone dei social media

La classe CSS per cambiare il blocco dei social media è .social-media-icons-container​

Link

La classe CSS per cambiare i tuoi link è .custom-link-container​

Feed
Le classi CSS per cambiare TikTok e Instagram sono:

.instagram-link-container

.tiktok-links-container

Esempio di codice CSS personalizzato

Ecco un esempio di modifiche di design e stile per la tua pagina:

Esempio 1:

.profile-section-photo-container .profile-section-profile-photo {

width: 100px;

height: 100px;

}

Ecco il cambiamento:

Esempio 2:

.custom-link-container{

border-radius: 10px 0 10px 0;

}

Ecco il cambiamento:

Esempio 3:

.instagram-link-container{

width: calc(50% - 2px);

}

Ecco il cambiamento:

Si prega di notare: Se vuoi cambiare il bordo del tuo feed, dovresti anche aggiungere questo codice nella classe:
box-sizing: border-box;

Se hai domande, fai clic sull'icona di chat in basso a destra per parlare con il nostro team del servizio clienti o inviarci un'email all'indirizzo support@embedsocial.com

Siamo qui per te 🙏

Hai ricevuto la risposta alla tua domanda?