RocketTheme - TOPIC: Use Image as Module header instead of text. (1/2)

Welcome Guest! Login

0 items Join Now

ROCKETTHEME IS CLOSING ON JUNE 30, 2025. As a thank-you to our community, enjoy 50% off all themes with the promo code THANKYOU before we shut down. Read our Farewell Blog Post for more details.

- mpideagroup
- Jr. Rocketeer
- Posts: 20
- Thanks: 0
Use Image as Module header instead of text.

Posted 15 years 7 months ago
- I'd like to replace the title text of a menu module with an image. I think I should be able to do that by adding a class to the template.css file and then calling the class suffix in the module. However I'd like a little clearer direction.
  
  If I add this to my css
  .new .h3.module-title {background: url(../images/take_me_here.png) no-repeat 0 1px;}
  
  Will that produce the change I am looking for or am I totally off base?
  
  Thanks
  CP
#411866
- Arifin FinLy
- Preeminent Rocketeer
- Posts: 17372
- Thanks: 18
Re: Use Image as Module header instead of text.

Posted 15 years 7 months ago
- It should be no dot in front of h3, so it will be like:
  .new h3.module-title {background: url(../images/take_me_here.png) no-repeat 0 1px;}
#412205
- mpideagroup
- Jr. Rocketeer
- Posts: 20
- Thanks: 0
Re: Use Image as Module header instead of text.

Posted 15 years 7 months ago
- I changed the code to remove the dot, but I can't get it to work. I called the class "new" in the module settings and nothing changed. I've attached an image showing the menu currently and the way I'd like the title image to display.
  
  Is there another way to accomplish this?
  
  attachment=1]menu_note.jpg[/attachment]
  
  This image is hidden for guests.
  Please log in or register to see it.
  
  Cody
#412341
- Arifin FinLy
- Preeminent Rocketeer
- Posts: 17372
- Thanks: 18
Re: Use Image as Module header instead of text.

Posted 15 years 7 months ago
- Could you please provide your website link so we can see and check the problem?
#413220
- mpideagroup
- Jr. Rocketeer
- Posts: 20
- Thanks: 0
Re: Use Image as Module header instead of text.

Posted 15 years 7 months ago
- Sure thing http://www.mpideagroup.com/nmsu I'll enable the class suffix again so you can have a look.
  
  Thanks
  Cody
#413486
- Arifin FinLy
- Preeminent Rocketeer
- Posts: 17372
- Thanks: 18
Re: Use Image as Module header instead of text.

Posted 15 years 7 months ago
- mpideagroup wrote:
  Sure thing http://www.mpideagroup.com/nmsu I'll enable the class suffix again so you can have a look.
  
  Thanks
  Cody
  Page Not Found error.
  Could you please check the link you provided me?
#413651
- mpideagroup
- Jr. Rocketeer
- Posts: 20
- Thanks: 0
Re: Use Image as Module header instead of text.

Posted 15 years 7 months ago
- Crud, I'm sorry http://www.mpideagroup.com/nmsuc I left off the 'c'.
  
  Cody
#413709
- Henning
- Preeminent Rocketeer
- Posts: 29363
- Thanks: 956
- Volunteer
Re: Use Image as Module header instead of text.

Posted 15 years 7 months ago
- wrong path to the image ....
  
  should be
  
  www.mpideagroup.com/nmsuc/images/stories/take_me_menu.png
  
  and dont forget a negative text-indent ...
#413743
- Henning
- Preeminent Rocketeer
- Posts: 29363
- Thanks: 956
- Volunteer
Re: Use Image as Module header instead of text.

Posted 15 years 7 months ago
- Should look like
  
  .new h3.module-title {background: url( www.mpideagroup.com/nmsuc/images/stories/take_me_menu.png ) no-repeat 0 1px;
  text-indent: -9999px;
  }
#413745
- Henning
- Preeminent Rocketeer
- Posts: 29363
- Thanks: 956
- Volunteer
Re: Use Image as Module header instead of text.

Posted 15 years 7 months ago
- or put that image into the template-folder ...
#413747