Need help? Check out our Support site, then


Special Header Question

  1. #header {
    	background: transparent url('http://torch.cs.dal.ca/~bate/wallpaper/yourmove1600x1200.jpg') no-repeat scroll center;
    	height: 600px;
    	padding-top: 115px;
    	position: relatively;
    	overflow-x: hidden;
    	box-shadow: inset 0 0 10px 1px #000000;
    }

    the picture is the: chess pieces

    Is there a way that I can change the header picture either by predetermining other pictures similar to a slide show, randomizing it, or causing a hover effect (as in when people hover above it it shifts)?

    I hate that only once header is there all the time. Preferably with CSS I doubt I could get it to work with changing the theme settings on wordpress since this was a customization itself.

    The blog I need help with is marcosbhd.wordpress.com.

  2. Hi, on the Triton Lite theme, there isn't a random header feature, and this isn't something that can be added with CSS. You could create a second image and use that as a "hover" image when someone hovers over the existing image. To do that, create a second header image the exact size of the existing image (1600px x 1200px), upload it to your media library, add the following CSS to your custom CSS and put the URL of that newly uploaded image between the quote marks where it says, URL_OF_IMAGE.

    #header:hover {
        background: url("URL_OF_IMAGE") no-repeat scroll center center rgba(0, 0, 0, 0);
    }
  3. Fantastic thank you!

  4. Sacred path is there a way to add social buttons to my page on the top of my page?

  5. Yes, where exactly did you want to add them?

  6. Ideally under the blog title Omega Delta Phi (well under the sub heading)

    or vertically along side one of my bottom widgets (the left) - contact info

    or vertically along my page

  7. This can be done. What you would want to do is to put your social icons into a Text Widget in the footer since the footer widget area is visible on all pages. We can then move that widget up and into position in the header area. One thing I will note is that we have to use position: absolute; to do this which means that there will be a bit of shifting of the position of the icons depending on whether someone is logged into WordPress (admin bar at top) or not logged in, the spacing between the title and the social icons will change depending on whether you are logged in or not.

    Here are some links on using a Text widget and creating linked images in text widgets.

    Text Widget
    Text Widget Links

    Once you have the text widget in the footer, let us know and we can help move it up and position it in the header area.

  8. I set up random ones Ill change them later but they are set. Is there a way to move my video up as well?

  9. Hi, the following is a start. Once you get your final icons into the text widget, there may be some adjustments needed. The following works for the most part, but starts to come apart at when the browser window is narrower than the content area. Give it a try and see what you think. Right now I have it spaced down from the title and description so it aligns properly when one is logged in. When one is logged out, there will be more space between the description and the social icons.

    body.container {
        position: relative;
    }
    
    #text-9 {
        position: absolute;
        top: 300px;
        width: 100%;
        text-align: center;
        left: 50%;
        margin-left: -50%;
    }
  10. On the video, the following centers it in the header area below the social icons and returns it to its width of 400px.

    #text-8 {
        position: absolute;
        top: 350px;
        width: 100%;
        text-align: center;
        left: 50%;
        margin-left: -50%;
    }
    
    #text-8 .textwidget iframe {
        width: 400px !important;
    }
  11. Sacredpath - I am so thankful to have you guys here. I cant thank you enough!!

    Godbless you!

  12. You are welcome.

Topic Closed

This topic has been closed to new replies.

About this Topic