Joomla Templates Club 406,261 posts

[toloekka Friend toloekkaJoin date: September 2007Posts: 117Downloads:168Uploads:35 Thanks: 6 Thanked: 7 times in 1 posts]

#160273

Hi.

How can I use my own gif files for “Read More in teline_iv?

If I make my own gif file with my own “Read More” font an arrows and point to that new gif file, I got the Default “Read More” text on top of my gif. How can I remove that?

I hope to use the gif file that we now are using on http://www.fluefiskesiden.no. (There we are using JA_Rochea).

toloekka 🙂

[Sherlock Friend SherlockJoin date: September 2014Posts: 11453Downloads:0Uploads:88 Thanks: 221 Thanked: 2478 times in 2162 posts]

#377299

Dear toloekka,

I think you just need to replace this image templates/ja_teline_iv/images/arrow-bg.png
Can you post here the url where the issue can be seen ?

[toloekka Friend toloekkaJoin date: September 2007Posts: 117Downloads:168Uploads:35 Thanks: 6 Thanked: 7 times in 1 posts]

#377357

dathq, I have replaced the png file templates/ja_teline_iv/images/arrow-bg.png with my own gif and that is working fine. It is the text “Read more” (Les mer … in Norwegian) on top of my new gif I have to remove. The text “Read more” will I use from my own gif file.

I can see this <span> Read more … </span> (Les mer … in Norwegian) when hovering over the text with Firebug.

The Site is offline. If you should see the Site, you have to edit your hosts file localy on your Mac/PC.

toloekka

[toloekka Friend toloekkaJoin date: September 2007Posts: 117Downloads:168Uploads:35 Thanks: 6 Thanked: 7 times in 1 posts]

#377386

I found a solution.:) I changed the color of the text to transparent and inserted a new witdh line because my “Read more” gif is 230px wide.

p.readmore a {
background: url(../images/arrow_red_green2.gif) no-repeat right top;
color: transparent !important;
display: inline-block;
font: bold 10px/20px "Trebuchet MS", Helvetica, sans-serif;
height: 20px;
width: 230px;
text-transform: uppercase;
}

p.readmore a:hover, p.readmore a:active, p.readmore a:focus {
background: url(../images/arrow_red_green2.gif) no-repeat right bottom;
color: transparent !important;
text-decoration: none;
width: 230px;
}

Default the color for the text was #000 and #FFF for hover.

toloekka

[Author]

Posts