Okay
  Public Ticket #2835306
Fonts
Closed

Comments

  • Omar started the conversation

    Hi,

    I need to change the fonts of the Amelia forms to match my website design.

    I can only choose from a few font families. How can i install a new font family?


    Thanks,

  • [deleted] replied

    Hi there

    Thank you for reaching out to us.

    If you need different font or Google fonts  you have to use wp_enqueue_style to insert them on wordpress. On this link you can find how.(find Properly Enqueuing Google Fonts in WordPress). 

    Do let us know if you need any further assistance. 

  • Omar replied

    Thank you Blazenka,


    I have performed the changes to my theme as suggested.
    However, I am afraid the list of fonts available on the Amelia plugin screen (the drop down list) remain unchanged.

    btw I already have access to google fonts via Elementor. The issue is how to get the Amelia plugin to use them?

    Any ideas?

  • [deleted] replied

    You can try using this CSS rule on the page between style tags where you will overwrite font from our plugin.

    <style>
    .amelia-app-booking input[type="text"], .am-modal.am-in-body input[type="text"], .amelia-app-booking input[type="email"], .am-modal.am-in-body input[type="email"], .amelia-app-booking input[type="tel"], .am-modal.am-in-body input[type="tel"], .amelia-app-booking input[type="url"], .am-modal.am-in-body input[type="url"], .amelia-app-booking textarea, .am-modal.am-in-body textarea, .amelia-app-booking select, .am-modal.am-in-body select, .amelia-app-booking .form-control, .am-modal.am-in-body .form-control, .amelia-app-booking .am-stripe-card, .am-modal.am-in-body .am-stripe-card,
    .amelia-app-booking h1, .am-modal.am-in-body h1, .amelia-app-booking h2, .am-modal.am-in-body h2, .amelia-app-booking h3, .am-modal.am-in-body h3, .amelia-app-booking h4, .am-modal.am-in-body h4, .amelia-app-booking p, .am-modal.am-in-body p, .amelia-app-booking span, .am-modal.am-in-body span, .amelia-app-booking div, .am-modal.am-in-body div, .amelia-app-booking section, .am-modal.am-in-body section, .amelia-app-booking ul, .am-modal.am-in-body ul, .amelia-app-booking li, .am-modal.am-in-body li, .amelia-app-booking a, .am-modal.am-in-body a {font-family:fantasy !important;}
    </style>

    We insert font fantasy just for example, but you will replace font that you need.