#menu-nav li a.page-item-62{
background: url("http://cdn4.iconfinder.com/data/icons/momenticons-gloss-basic/momenticons-gloss-basic/32/information2.png") no-repeat scroll left center transparent;
padding-left: 36px;
}
Thanks Timdesain. Can you explain what that means, sorry i’m really new to this.
what is a.page-item-62 referring to?
My menu is in the side panel, do I still use #menu-nav?
if you are using wp_nav_menu or wp custom menu
try li .menu-item-xx, xx refer to page ID
else
try li .page-item-xx, xx refer to page ID
without #menu-nav
I’m sorry for not understanding this more quickly…I basically have zero idea of what i’m doing …
so i type this into my style.css
li .menu-item-100{
background: url(“http://productlove.net/wp-content/themes/mirandastheme/images/heartbig.png”) no-repeat scroll left center transparent;
padding-left: 36px;
}
?
I’ve done this and nothing happens….
Could you really dumb this down for me!?
your menu is empty
<ul class="main-nav" id="menu-nothimg"></ul>
make sure your menu appears first
then set the style
your server is case sensitive
mirandastheme <> Mirandastheme
ex:
http://productlove.net/wp-content/themes/mirandastheme/images/heartbig.png
http://productlove.net/wp-content/themes/Mirandastheme/images/heartbig.png
to set backgrond, no need to set absolute path, you can set with
background: url("images/heartbig.png") no-repeat left;
more tuts
http://www.w3schools.com/css/css_background.asp
Thanks for your response
It is the sidebarmenu that I want to alter … “About” “contact” “Submit”
not the nothimg menu
owh, i’m sorry.
change
li .menu-item-100 {
background: url("http://productlove.net/wp-content/themes/mirandastheme/images/heartbig.png") no-repeat left;
padding-left: 36px;
}
with
li .menu-item-100 {
background: url(images/heartbig.png) no-repeat scroll left center transparent;
padding-left: 36px;
}
note: your image is too big.
resize image to 24×24 px or 32×32 px
I have resized it to 32×32 and put the code in but nothing happens?
This is driving me crazy!
take it easy.
🙂
uninstall/ deactivate custom-menu-image plugin, please.
and where is the style before? gone?
nevermind, add this to style.css
#menu-item-103 a ,
#menu-item-104 a ,
#menu-item-105 a {
background: url(images/heartbig.png) no-repeat left;
padding-left: 36px;
}
some success!
There is not enough space for the full image…How do i adjust the space?
Can I hide “about” “submit” and “contact” text?
Also, the image I acutally want to use is larger than 32x 32 (I was just using heartbig.png as a test). Is it possible to have a bigger image?
Basically I want my links to look like this site: http://www.behindballet.com/ “merry widow” “ballet vs fashion” – large circle with text centred in the middle
thanks so much for your help!!!! I really appreciate it!
yes, of course.
i have an interesting idea for you.
remove
#menu-item-103 a ,
#menu-item-104 a ,
#menu-item-105 a {
background: url(images/heartbig.png) no-repeat left;
padding-left: 36px;
}
and add
#menu-sidebarmenu a {
display: block;
height: 78px;
padding-top: 50px;
width: 128px;
margin: 1px auto;
text-align: center;
font-style: italic;
color: #FFFF00;
background: url("http://cdn1.iconfinder.com/data/icons/DarkGlass_Reworked/128x128/apps/package_favourite.png") no-repeat top;
}
cheers.
😀
you can replace the image with yours. http://cdn1.iconfinder.com/data/icons/DarkGlass_Reworked/128×128/apps/package_favourite.png
dimension: 128x128px
OH wow!! You are AMAZING. Thank you!
Want to help me with some other blog problems??!! I have quite a few!
you are welcome.
🙂
please mark your topic as “Resolved”. Thanks
http://codex.wordpress.org/Forum_Welcome
