Make footer area look like header area

  • Anonymous

    #10552

    Hello,

    I’d like to acknowledge that there’s a topic similar to this one which has already been solved. (https://forum.graphene-theme.com/graphene-support/want-menu-in-my-footer-to-match-top-menu-in-every-detail-plz)

    However, I spent several hours trying to use that information to apply it on my own site, but I had very limited success.

    Cleaning Up The Footer Area by hiding a few things and modifying the copyright info, & possibly some padding adjustments:

    [img]http://www.adultchatclub.com/footerarea.JPG[/img]

    1) The first arrow points to a border-line that you can hardly see. It’s there, and I want to hide it.

    2) The 2nd arrow points to a white bar, and I want to hide that.

    3) The 3rd arrow points to a pinkish-white bar, and I want to hide that.

    4) The 4th arrow points to a black region that rests between the pinkish-white bar & the Footer Menu. I want to hide it.

    5) The last part is a black region I marked with a rustic letter C. I want to hide that area too.

    6) Another thing I’d like to do is get the “2016 Adult Chat Club” moved up and just to the right of the word “Copyright.”

    After doing all that, my footer area would look like this photoshopped drawing:

    [img]http://www.adultchatclub.com/fantasyfooter.JPG[/img]

    Here is a link to my site.

    I’m using a child theme, so I can apply changes to my graphene-child-theme’s files.

    Anyone reading this, I want you to know that I value your time, and I appreciate any help you can offer, even if it’s only part of the solution. I searched the forums here for help on this topic and I found some, but I just can’t get it right based on what I’ve discovered by searching in a few different variations of “hide footer elements.”

    I have spent a lot of time trying to figure out where these elements are located & what they are called, but I’ve had very limited success.

    Mod

    Kenneth John Odle

    #46405

    You have disabled right click* so it is difficult to diagnose these things.

    *Why, though? This does nothing to prevent people from stealing your content. Indeed, it disables the way a lot of people navigate web sites and is a disincentive to come back.

    I can get around this fairly easily, but it’s better if you just get rid of it.

    Anonymous

    #46406

    I agree. I’m sorry, it slipped my mind that this would affect viewing page source, and things like that. I recently bought my first logo, and was trying to protect it, but you’re right, anyone could just use Snipping Tool, or something like that to grab it if they really wanted it.

    I have removed the plugin that was preventing right clicks.

    Mod

    Kenneth John Odle

    #46407

    Try this code:

    #footer {
    background: none #111;
    border-top: none;
    margin: 0;
    padding: 0;
    height: auto;
    }
    #copyright h3 {
    display: inline-block;
    }
    #copyright p {
    margin: 0 0 0 1em;
    display: inline-block;
    }

    A few notes for anyone who may be interested:

    The bar above the footer (2nd and 3rd arrows) is part of a background sprite image for the footer. background: none turns that off. background: #111 makes sure you still have (almost) black for a background. height: auto overrides the height declaration in the Graphene theme. (I think it’s set to min-height: 80px)

    h3 and p elements are block elements, so they tend to stack vertically on a page, like blocks in a wall. Setting both the h3 and p in the #copyright div to display: inline-block makes them act like train cars instead: they follow one another horizontally.

    I added 1 em of margin to the left side of the #copyright p so you wouldn’t have to add a non-breaking space to your copyright notice. (That probably doesn’t affect SEO, but now that I’ve said that, you can probably find 20 people on the web who will say that it does. At any rate, it’s one less screen to visit.)

    All of this works on my end; YMMV, of course. If you have problems or troubles, just let us know.

    Alas, theft of things is just a part of living on the internet. Photoshop does have a plugin (extension? I forget what it calls these.) that will allow you to add an invisible watermark to your images, but I don’t know how effective it is. And being Adobe, it is not free, nor is it cheap.

    Anonymous

    #46408

    Thanks! This is a major improvement for me.

    I sincerely thank you for the time you spent on this.

    Mod

    Kenneth John Odle

    #46409

    Glad I could help!

    Marking thread as resolved. You can do this yourself as well.

Viewing 6 posts - 1 through 6 (of 6 total)

  • You must be logged in to reply to this topic.