[SOLVED]Change Font Color in Part of Short Description

[bakgerman1972]

Hello I have J 3.4 and VM3 installed on my site.

Please see this category view where I have made a single word bold and red in the short description:
http://puu.sh/k9GRz/7069ec8476.jpg
http://www.bmbtechnology.com/products/eco-series.html

No problems here.

But when I actually click on the product details to go to the product page, I get an error on top left of the page. Please see here:
http://puu.sh/k9H3q/fa7354afc0.jpg
http://www.bmbtechnology.com/products/eco-series/bmb-10-mineral-detail.html

As you can see the short description is displayed properly but it also displays a run off on the top left corner of the page.

Now here is the weird part.
This is my original short description that makes this problem:
Code:

Code Select Expand

Self-standing, 5 filter reverse osmosis system that incorporates a pH stabilizer, nano zinc powder activated antibacterial filter and <font color="ce4d39"><strong>Mineral</strong></font> filter for anti-aging water properties.


If I remove the font color tag then no problems everything works fine:
Code:

Code Select Expand

Self-standing, 5 filter reverse osmosis system that incorporates a pH stabilizer, nano zinc powder activated antibacterial filter and <strong>Mineral</strong> filter for anti-aging water properties.


If I try another approach again I have the same problem:
Code:

Code Select Expand

Self-standing, 5 filter reverse osmosis system that incorporates a pH stabilizer, nano zinc powder activated antibacterial filter and <strong style="color:red" >Mineral</strong> filter for anti-aging water properties.


This only happens, I guess, when I try to make a different color inside the short description for one or a few words.

Can someone please help me.

[jenkinhill]

Just look at the page code!!  This looks like where the problem lies:
<meta property="og:description" content="Self-standing, 5 filter reverse osmosis system that incorporates a pH stabilizer, nano zinc powder activated antibacterial filter and <font color="ce4d39"><strong>Mineral</strong></font> filter for anti-aging water properties."/>

You could maybe fix this in your open graph plugin.  Disable it to confim that's where the problem is.

[bakgerman1972]

Hi Jenkin,

Thanks for the very quick reply!

I am somewhat of a newb, I can fiddle with php code and css etc., but please excuse me if this sounds totally stupid:
- where do I find the open graph plugin, I did a search for "open" and "graph" in plugins but ... :-(

[jenkinhill]

Either you installed it or it came with your template - you can get a load of unwanted crap if you use a "quick start" package. But this is a Joomla question - not about VirtueMart.

[bakgerman1972]

Hi Jenkin,

Again thanks for your quick reply. Unfortunately your last comment is not that helpful. I have search VM and J forums but there is no information for anyone wanting to change the color of a single word in the VM short description. Not sure what would happen on other versions.

[GJC Web Design]

Your markup is simply wrong..  you need to improve your basic css skills
The <font> tag is not supported in HTML5. Use CSS instead.

<font color="ce4d39"><strong>Mineral</strong></font>

ce4d39 isn't a color--  #ce4d39  is

<span style="color:#ce4d39"><strong>Mineral</strong></span>

[bakgerman1972]

Hi,

I had also tried that before but it did not work. If you look now you can see I am using exactly what you wrote and still it is not working. Any other ideas?

[bakgerman1972]

Fixed using this:

http://www.flexiblewebdesign.com/forum-joomla-virtuemart-template-coolmart-support/1611-wrong-display-when-html-tag-in-short-desc-flypage

[GJC Web Design]

Exactly as jenks says -- what ever is forming your :og tags is not striping html as it must .. use something like strip_tags() in how ever the og tag is formed

have you also looked at the source code of your site.. vast amounts of inline css..  huge amounts of javascript
a page load of 2+MB!!!

[bakgerman1972]

I am a huge failure 

[GJC Web Design]

It is the template at fault... sadly many templates out there are very poorly coded forgetting that a website is .. well..  internet based..