WordPress.org

1. blunted
   Member
   Posted 7 years ago #
   

   I'm trying to adapt an existing template to incorporate a button array. I can get the buttons to show, but the rollover images don't work. It seems like the easiest way to get it working is to link to a (second) related stylesheet, instead of trying to adapt the existing one.

   What code would I need to put in the header to do this, please? I've tried adding a second set, but I get the impression I'm doing it wrong, or there's an issue with inheritance. Dunno - I'm stuck, and I can't find anything relevant in the codex.

2. Beel
   Member
   Posted 7 years ago #
   

   The same code as with the original one, just pointed to the second one.

3. blunted
   Member
   Posted 7 years ago #
   

   Hi, Beel - thanks for the reply, but I can't make it work. The existing tag uses PHP to import the url of the stylesheet, as quoted below. I can't figure out what to write so that it'll find mine. I tried putting a straightforward "<LINK REL=stylesheet HREF="yourfile.css" TYPE="text/css">" in there, but it doesn't work - does it need some PHP notation to get it going?

   Here's a small section of the head, where I guess it goes. Is it better to add another style tag, or... hell, I'm baffled. Somebody help me, please.

   <style type="text/css" media="screen">
@import url( <?php bloginfo('stylesheet_url'); ?> );
</style>
<link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="<?php bloginfo('rss2_url'); ?>" />

4. ifelse
   Member
   Posted 7 years ago #
   

   Firstly, depending on the complexity of the two stylesheets, it may be easier to just copy and paste the entire content of the second stylesheet at the end of the first.

   However, to answer your question.

   1. Place the 2nd stylesheet in the same directory as the themes 'main' style sheet i.e. [blog_url]/wp-content/themes/[your_theme]/.

   2. Now modify the header.php file. Change the stylesheet references to:
   <style type="text/css" media="screen">
@import url( <?php bloginfo('stylesheet_url'); ?> );
@import url(<?php bloginfo('stylesheet_directory'); ?>/stylesheet2.css);
</style

   where stylesheet2.css is obviously the name of your 2nd stylesheet.

5. Beel
   Member
   Posted 7 years ago #
   

   I use multiple themes so any code I want to show up in all themes is placed in a "myadds.css" in my root directory and called in the header of each theme with:
   <link rel="stylesheet" href="http://mysite/myadds.css" type="text/css" media="screen" />

6. blunted
   Member
   Posted 7 years ago #
   

   ifelse - thanks for that explanation. I've got the link to the stylesheet now, and the buttons show, but the rollover effect still doesn't work, so I guess there must be a flaw in the css.
   I think it's because of the way I've notated the link/hover etc. Here's a bit of my code. Any ideas where I'm going wrong?
   
#rollover1
{
float: left;
width: 119px;
height: 41px;
border: none;
padding: 0px;
margin: 0px;
background: url(images/f2_onyx_tabs_01.jpg) no-repeat 0px 0px;
}

   #rollover1 a:link
{
background:url(images/f2_onyx_tabs_01.jpg) no-repeat 0px 0px;
}
#rollover1 a:hover
{
background:url(images/f2_onyx_tabs_01-over.jpg) no-repeat 0px 0px;
}
#rollover1 a:active
{
background:url(images/f2_onyx_tabs_01-over.jpg) no-repeat 0px 0px;
}

   It's either that I'm using full stops instead of hashes, or I need to put all the information into one set of brackets. It's weird though - I got the whole thing working, using 'class' instead of 'id' in a html document. I don't understand why it won't work in a php document.

   Beel - thanks, but I tried that before, and all I got was a black page - view source on the page, and all the info was there, but absolutely nothing showed, not even when selecting with a mouse sweep.

   Many thanks for the help, both of you :)

7. blunted
   Member
   Posted 7 years ago #
   

   Should I post this in the CSS section, or just wait a while longer? Not sure what to do - I don't want to upset anybody by spamming this around.

8. blunted
   Member
   Posted 7 years ago #
   

   I figured it out by trial and error, eventually....

9. jbbrwcky
   Member
   Posted 7 years ago #
   

   Blunted - what was it that you fixed - post it so others can make use of it :)

10. blunted
    Member
    Posted 7 years ago #
    

    jbbrwcky - it was pretty simple, once I figured out what was wrong. I've still no idea why the above code works fine in a html document, but doesn't in php. I don't know what made me think of it, but the solution is to repeat the placing information for each state of the rollover and forget about the 'link' one altogether, like this -
    
#rollover1
{
float: left;
width: 119px;
height: 41px;
border: none;
padding: 0px;
margin: 0px;
background: url(images/f2_onyx_tabs_01.jpg) no-repeat 0px 0px;
}

    #rollover1: hover
{
float: left;
width: 119px;
height: 41px;
border: none;
padding: 0px;
margin: 0px;
background:url(images/f2_onyx_tabs_01-over.jpg) no-repeat 0px 0px;
}
#rollover1: active
{
float: left;
width: 119px;
height: 41px;
border: none;
padding: 0px;
margin: 0px;
background:url(images/f2_onyx_tabs_01-over.jpg) no-repeat 0px 0px;
}

    Note that I also got rid of the 'a' tag in each state. If you want to add a depressed button state, you put a different image in the 'active' part of the CSS script.

    It all works fine now - the buttons anyway. I've still got problems with something else. I want to put a background colour behind the calendar, but I can't find the damn thing anywhere, so I can't change it. Seems like it's pulled right out of the database, but I could be wrong. This could take a while yet.

    This is what I've got so far - http://www.cafedoom.com/wordpress/ (try the buttons out). As you can probably see, I've got a grey background to show behind the calendar now, but it goes outside of where I want it, because I made the background show it the sidebar field, rather than just the calendar. Pain in the arse.

    I'm trying to make WordPress look a bit like the original website, and then I'll adapt everything (content) to suit. The links are currently outside of WP, but once I've got this thing figured out, it'll all be inside and, hopefully, easier to maintain and update. Searchable too.

Topic Closed

This topic has been closed to new replies.