How do I color ouside the lines?

  • Hey Folks :::

    I want to put some code for an email list sign-up box outside of the normal confines of my website. In other words, in the top right-hand corner over top of the light blue background :: https://www.probioticsoundsystem.net

    Anyone know how to go about this? I’m using a theme that I created with Artisteer.

    Best ::: Oliver Giving

Viewing 7 replies - 1 through 7 (of 7 total)

  • use an absolute/fixed positioned div…..

    I use it on rvoodoo.com over on the right to make a link for my new site

    <body class="home blog">
<div id="floater">
<a href="https://voodoopress.com">
<img src="https://www.rvoodoo.com/empire/wp-content/uploads/2011/02/vpfloater.png" alt="VoodooPress" title="Visit VoodooPress for all Your WordPress Support!" />
</a>
</div>

    and the css

    #floater {
	position: fixed;
	top: 100px;
	right: 10px;
	z-index: 999;
}
    Thread Starter Oliver Giving

    (@oliver-giving)

    Thanks for your help Rev. Voodoo! Where do I paste this code? In my stylesheet? Whereabouts?

    I’m new to this code business…

    Much Thanks,

    Oliver

    Ah, well, the first bit goes wherever your display starts. It’s probably in header.php. look for the <body tag, that’s why I included my body tag in the code, for reference. Don’t copy that line, you don’t want the body tag twice.

    It would go under that

    And the second bit is css, so yup, in your stylesheet

    the position fixed keeps whatever your code is on the screen all the time, so when visitors scroll up and down, the item stays at the same spot on the screen.

    position absolute would put it in the same spot, but it wouldn’t scroll

    (note, that’s not always how fixed/absolute behave…. just in this case https://www.w3schools.com/Css/pr_class_position.asp can explain them better)

    the top and right numbers are pixels from the edge of your monitor

    Also, cool site, I’ll be checkin out the music! rvoodoo.com has a fair bit of music you may like!

    Thread Starter Oliver Giving

    (@oliver-giving)

    It worked! I’m amazed that I actually could do it :: https://www.probioticsoundsystem.net

    Thanks for all your help Rev. Voodoo. It is much apreciated. And I’m glad you dig the podcast.

    Good job!!!

    And yup, always lookin for good tech or prog for my hour commute!

    Thread Starter Oliver Giving

    (@oliver-giving)

    werd! iTunes subscribe will be coming soon ??

    Thread Starter Oliver Giving

    (@oliver-giving)

    @rev. Voodoo: Do you know how to reference the right edge of a website (in my case the blue line which encases all my content) for the floater instead of the right edge of the screen? I have tested the new setup on a few friend’s screens and on lower resolution ones, the email list sign up box runs into the content. I think this could be fixed if the box know where the edge of my content is. This make sense?

    Oliver

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘How do I color ouside the lines?’ is closed to new replies.