What's your biggest current challenge? Have your say in Community Polls along the right column.

Modification police

Modification police

Vanayildirim
Visitor
1 0 0

Je rencontre un problème lorsque je veux changer la police de certaines phrases sur mon site, ça me modifie l'ensemble de la typographie de mon site.

 

En vous remerciant par avance de votre retour,

 

Cordialement,

 

 

Replies 2 (2)

analyteecs
Tourist
5 0 1

To change the font of specific phrases without affecting the entire site's typography, consider these solutions:
1. Use HTML span tags: Wrap the phrase in <span> tags and apply the desired font style.
Example: <span style="font-family: 'New Font', sans-serif;"> Specific phrase</span>

Create a custom CSS class:
a) Go to Shopify Admin > Online Store > Themes > Actions > Edit code.
b) In the CSS file (e.g., styles.css), add:
.custom-font { font-family: 'New Font', sans-serif;}
c) Apply the class to the phrase:
<p class="custom-font"> Specific phrase</p>
1. Utilise a page builder or theme settings:
Check if your theme or page builder (e.g., Shopify Page Builder, Elementor) offers font customisation options.
Target specific elements with CSS:
Use CSS selectors to target the phrase's container element and apply the font style.
Example:
.header-title . subtitle { font-family: 'New Font', sans-serif; }
If you're still stuck:
1. Provide your website URL and phrase location.2. Share your theme name and version.3. Clarify the desired font and styling.
I'll assist with:
Custom CSS code.- HTML implementation.theme-specific guidance.
If this solves your question and it gets fixed, kindly mark as solution.

diana45peters
Visitor
1 0 0

@Vanayildirim wrote:

Je rencontre un problème lorsque je veux changer la police de certaines phrases sur mon site, ça me modifie l'ensemble de la typographie de mon site.

 

En vous remerciant par avance de votre retour,

 

Cordialement,

my Wellstar portal

 


Bonjour,


Pour éviter de modifier toute la typographie du site, assurez-vous que vos sélecteurs CSS sont spécifiques aux éléments que vous souhaitez changer. Par exemple :

  1. Utilisez une classe ou un ID pour cibler des éléments spécifiques :
    .mon-texte { font-family: 'NouvellePolice', sans-serif; }

  2. Évitez les sélecteurs globaux comme * ou body, qui affectent toute la page.

  3. Si nécessaire, ajoutez !important pour écraser les styles hérités :
    .mon-texte { font-family: 'NouvellePolice', sans-serif !important; }