Joomla Templates Club 406,261 posts

[bohemiadesign Friend bohemiadesignJoin date: March 2010Posts: 194Downloads:26Uploads:19 Thanks: 16 Thanked: 1 times in 1 posts]

#149664

Hi,

Is it possible to change the background image to cover the whole title for the module and not only the first word?

Thanks,

Jonas

[Anonymous Moderator JA DeveloperJoin date: September 2014Posts: 9914Downloads:207Uploads:152 Thanks: 1789 Thanked: 2008 times in 1700 posts]

#337222

Hi sir

Please try to do with my way:

Open template.css file, add following code section to the end of file:

.first-word {
background: none !important;
}

.first-word strong {
background: none !important;
}

Hope it helps

[bohemiadesign Friend bohemiadesignJoin date: March 2010Posts: 194Downloads:26Uploads:19 Thanks: 16 Thanked: 1 times in 1 posts]

#337223

Hi,
Thanks for getting back to me. I tried that code but it removes the background completely – the text is still there but the background image is gone. I am still working on the localhost hence the reason I can’t post a link.

Jonas

[Anonymous Moderator JA DeveloperJoin date: September 2014Posts: 9914Downloads:207Uploads:152 Thanks: 1789 Thanked: 2008 times in 1700 posts]

#337338

Hi bohemiadesign

Please try:

1 . Open templates/ja_rasite/css/template.css file
2. add my code as this link: http://www.joomlart.com/forums/showpost.php?p=170688&postcount=2
3. find following code section:

div.ja-moduletable h3 span strong.first-word, div.moduletable h3 span strong.first-word {
background: url(../images/title-brown.gif) no-repeat top left #57212a;
color: #fff;
display: inline;
margin: 0 5px 0 0;
padding: 3px 0 4px 10px;
}

div.ja-moduletable h3 span strong.first-word strong, div.moduletable h3 span strong.first-word strong {
background: url(../images/title-brown.gif) no-repeat top right;
margin: 0;
padding: 3px 10px 4px 0;
}


and change to:

div.ja-moduletable h3 span strong.first-word, div.moduletable h3 span strong.first-word {

display: inline;

}

div.ja-moduletable h3 span strong.first-word strong, div.moduletable h3 span strong.first-word strong {

margin: 0;

}


4. find following code section:

/* All title style ---*/
.title-brown h3 span strong.first-word {
background: url(../images/title-brown.gif) no-repeat top left #57212a !important;
}

.title-brown h3 span strong.first-word strong {
background: url(../images/title-brown.gif) no-repeat top right #57212a !important;
}

.title-black h3 span strong.first-word {
background: url(../images/title-black.gif) no-repeat top left #000000 !important;
}

.title-black h3 span strong.first-word strong {
background: url(../images/title-black.gif) no-repeat top right #000000 !important;
}

.title-blue h3 span strong.first-word {
background: url(../images/title-blue.gif) no-repeat top left !important;
}

.title-blue h3 span strong.first-word strong {
background: url(../images/title-blue.gif) no-repeat top right !important;
}

.title-green h3 span strong.first-word {
background: url(../images/title-green.gif) no-repeat top left #6C830E !important;
}

.title-green h3 span strong.first-word strong {
background: url(../images/title-green.gif) no-repeat top right #6C830E !important;
}

.title-orange h3 span strong.first-word {
background: url(../images/title-orange.gif) no-repeat top left #9E6202 !important;
}

.title-orange h3 span strong.first-word strong {
background: url(../images/title-orange.gif) no-repeat top right !important;
}

and remove or comment it.

Please backup all files before make any changes.

[bohemiadesign Friend bohemiadesignJoin date: March 2010Posts: 194Downloads:26Uploads:19 Thanks: 16 Thanked: 1 times in 1 posts]

#337372

Hi,
Thanks for getting back.
The fix posted removes the background image – what I was after is how to have the background image to “cover” both word in the title.
For example if the title is – Latest News – I want the background to be behind both word not only the first word.

I think it has something to do with this code in the module.php file (ja_rasite/html) but unfourunatley I don’t know my way around javascript very well.


// Add span to module title
$title = $module->title;
$pos = strpos($title, ' ');
if ( $pos !== false ) { $title = "<strong class="first-word"><strong>" . substr($title, 0, $pos+1) . "</strong></strong>" . substr($title, $pos+1); }
else { $title = "<strong class="first-word"><strong>" . $title . "</strong></strong>"; }
?>

Thanks

Jonas

[Author]

Posts