Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #1407641

    I recently switched to using this code to make the word “Search” next to the mangnifying glass clickable. That worked but now it doesn’t translate when the user switches to French.
    #menu-item-search a:after {
    content: ‘ Search’;
    }

    I need the “Search” text to be translated when the user switches language to French (we’re using TranslatePress).
    Translation works fine with this code:
    #top .avia_hidden_link_text {
    display: block;
    float: left;
    }
    Is there a way to make the text both clickable and translateable?

    Thanks,
    Guy

    #1407795

    Hey guychalk,

    Thank you for the inquiry.

    You have to add the following css rule to adjust the search text when the French language is active.

    html[lang=fr_FR] #menu-item-search a:after {
        content: ‘ Recherche’;
    }

    Please make sure to toggle or temporarily disable the Enfold > Performance > File Compression settings after adding the css modification.

    Best regards,
    Ismael

    #1407843

    Hi Ismael,
    I’ve added the code to my child themes style.css, but it doesn’t have any effect. Below is the code that I have in that file. I did clear cache and have compression turned off.
    Do you have any idea why this isn’t working.
    I’ve included a link to the site.
    Thanks,
    Guy

    #menu-item-search [data-av_icon]:before {
      float: left;
      margin-right: 2px;
      font-size: 16px !important;
    }
    
    html[lang=fr_FR] #menu-item-search a:after {
        content: ‘ Recherche’;
    }
    
    #menu-item-search a:after {
      content: ' Search';
    }
    #1407854

    Hi Ismael,
    I figured it out. The language code set by translate press is fr-FR for french and en-EN for English. This is what worked for me. You can close this ticket!
    Thanks a lot,
    Guy

    /** New Search **/
    
    #menu-item-search [data-av_icon]:before {
      float: left;
      margin-right: 2px;
      font-size: 16px !important;
    }
    
    html[lang=en-US] #menu-item-search a:after {
      content: ' Search';
    }
    
    html[lang=fr-FR] #menu-item-search a:after {
      content: ' Recherche';
    }
    
    /** end new search **/
    #1407911

    Hi,

    Great! Glad to know that you managed to modify the code and resolved the issue. Let us know if you have more questions.

    Have a nice day.

    Best regards,
    Ismael

Viewing 5 posts - 1 through 5 (of 5 total)
  • The topic ‘Need the word “Search” next to the icon to be both clickable + translate-able’ is closed to new replies.