Visal Editor delete "<i class="icon-right"></i>" in text-link

Astrophytum

Hello,

please see this site: https://pilze-vogtland.de/

 I use text-links, you see this near the big arrow-right.

  

This is the code of the first section: 

<p><strong>Liebe Besucher,</strong><br

/><br />das schwerpunktmäßige Anliegen dieser kleinen Webseite ist es, die Pilze meiner Heimat, des <i class="icon-right"></i><a href="https://de.wikipedia.org/wiki/Vogtland" target="_blank" rel="noopener">Vogtlandes</a>, vorzustellen. <br />Natürlich werden auch Pilz-Porträts der angrenzenden Länder Franken, Sachsen, Thüringen und Tschechien, sowie aus ganz Europa, zu sehen sein.</p>

  

I generate the arrow-right with: <i class="icon-right"></i>

So far, so good.

 

When I edit the Text with BeBulider and use the Visual Editor, the Visual Editor will delete the phrase "<i class="icon-right"></i>" automatically, when I edit the text in section. Why?

So it's very expensive to enter the "<i class="icon-right"></i>" by hand again and again...

Is there a solution, that the "<i class="icon-right"></i>" will be inserted automatically, when I generate an text-link?

 

Kind Regards,

Steffen

Pablo

Hello Steffen,

The only solution to do that, is by using CSS, but it will apply to all of the links of the website (Content container), or by some class which will be pinned to the link, for example.

<a href="#" class="icon-right"> Text </a>

If it's suits you, tell me, I'll create the code for you.

thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

Astrophytum

Hello,

yes, please create my the CSS code for all links of the website.

Kind Regrds,

Steffen

Astrophytum

... the arrow right must have the same green as text. #0a5614

Kind Regrds

Steffen

Pablo

Please use this CSS code, paste it to Theme Options -> Custom CSS & JS -> CSS

#Content a::before{
 font-family: mfn-icons;
 font-style: normal;
 font-weight: 400;
 speak: none;
 display: inline-block;
 text-decoration: none !important;
 width: 1em;
 margin-right: .2em;
 text-align: center;
 font-variant: normal;
 text-transform: none;
 line-height: 1em;
 margin-left: .2em;
 content: "\e911";
 color:#0a5614;
}

Thanks

Learn more: Video Tutorials | How To | FAQ Vote on what comes next

Astrophytum

Hello,

thank you very much, CSS-code is working very well. :)

Kind Regards,

Steffen