Page 1 of 1
How to make module title show a graphic or image?
Posted: Thu Mar 01, 2012 12:13 pm
by igolfniray
I want to replace some of my module titles with a simple graphic rather than the normal text title.
What way would you recommend I achieve this?
Ray
Re: How to make module title show a graphic or image?
Posted: Thu Mar 01, 2012 1:57 pm
by shakur1911
I recommend hiding the title and adding the image inside the module contents
Re: How to make module title show a graphic or image?
Posted: Thu Mar 01, 2012 9:15 pm
by igolfniray
I tried that but It didn't give me enough control over the module in terms of class-suffix etc.
I got it working by adding a new module class suffix with a background image called in with the CSS:
in my templates "modules.php" file (every template has one! I'm using a YooTheme.) I added code like this:
Code: Select all
case 'imagetitle':
$title_template = '<h3 class="image-title">%s</h3>';
break;
Then I added this to my "modules.css":
Code: Select all
.image-title {
background-image:url(../../../images/image.png);
margin-bottom:5px;
margin-right: 20px;
line-height:53px;
background-position:center;
background-repeat:no-repeat;
font-size:0px;}
Then I have to make sure I enter (in a Yootheme at least) "style-imagetitle" to the Module Class Suffix, AND make sure my title is set to "Show".
That's how I achieved it but I imagine in other Templates, the files will be slightly different.
But the strategy will be the same:
Create a new Module Class Suffix.
Call your image in CSS.
Make the font size zero.
Re: How to make module title show a graphic or image?
Posted: Thu Mar 01, 2012 9:37 pm
by shakur1911
Nice one, thank you for sharing your solution