Black Friday Sale! Get up to $40 off GP Premium!Learn more

[Support request] How do I get my site to look like this?

Home Forums Support How do I get my site to look like this?

Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • #467066
    Cedric

    Hey,
    I’m working on my site right now and I’d really appreciate it if you could tell me what settings I have to make in order to achieve a site design that looks similar to this one:
    bitcoin.org

    So the header and main menu should be centralized above the content area as in the example, the content area does adjust to your screen I think but I’m not sure.
    I want the content area to be a different color and the rest of the site should encompass it like a framework, same as in the site mentioned.
    The edges should be soft and a little round if possible, but I really have no clue how to do that.

    #467196
    Leo
    Staff
    Customer Support

    Hi there,

    You can try adding the logo as a menu item here: https://docs.generatepress.com/article/centering-logo-navigation/#add-your-logo-to-the-navigation

    Then set the alignment to center: https://docs.generatepress.com/article/navigation-layout/#navigation-alignment

    For colors, you can adjust the body background color and content background color in the customizer:
    https://docs.generatepress.com/article/colors-overview/

    Rounded border would be this CSS:

    .inside-article {
        border-radius: 10px;
    }

    Adding CSS: https://docs.generatepress.com/article/adding-css/

    A link to your site might help if any of the above doesn’t work 🙂

    #467225
    Cedric

    Hi,
    thanks for the fast reponse.
    Do I have to upload the logo to a third party site?
    Because it says in the instructions here:
    https://docs.generatepress.com/article/centering-logo-navigation/#add-your-logo-to-the-navigation

    Now go to Appearance > Menus and add a new Custom Link.

    As the URL, add in your home page URL (or whatever you like).

    As the Link Text or Navigation Label, add in your logo image HTML:

    Your site name

    So that would be something like:
    < imgc src=”mypicture3333.com/logo” alt=”Sitename123″ title=”Sitename123″ />

    #467665
    Leo
    Staff
    Customer Support

    That’s not a third part site. It’s adding it as a menu item using WordPress’ menu structure:
    https://docs.generatepress.com/article/using-the-wordpress-menu-builder/#custom-classes

    #468801
    Cedric

    Hey,
    so I still don’t know how to add the logo to the menu, specifically what to enter as img src.
    Also I’d like to have a soft colored frame around the content area as in the site mentioned is that possible by chance?

    < imgc src=”mypicture3333.com/logo” alt=”Sitename123″ title=”Sitename123″ />

    I don’t get what to enter there as img src, doesn’t show my logo when I enter my websites’ URL.

    #468874
    Leo
    Staff
    Customer Support

    It should be the URL of your logo image.

    See the file URL on the right side of the image: https://codex.wordpress.org/Edit_Media

    #468883
    Cedric

    Alright that worked thanks’s alot, now there’s 1 things left I need to do for now.

    I wanna create a colored border around my content area, the container width is 900px, is there any way to do so?

    #468898
    Cedric

    Actually one more thing, if I hover over my logo now it turns blue because I set a menu hover background, is there any way to get rid of it just for the logo?

    #468925
    Leo
    Staff
    Customer Support

    Can you link me to the page in question?

    Thanks.

    #468951
    Cedric

    I want it to look as close as possible to this one:

    bitcoin.org

    So the menu should be closer to the logo, the logo more to the left.
    There should be a border around the content area, and the blue background in the logo if you hover the mouse around it should not be there.
    Would appreciate any help achieving a better result of course 🙂 , thanks.

    #469005
    Heiko

    I am really impressed how patiently and persistently Tom and Leo answer all the questions here, even if they are no support questions at all! 🙂

    @Cedric: If you want to have the logo on the left, just change the settings under Customizer -> Layout -> Hauptnavigation -> Ausrichtung der Navigation = Links.

    I have no hover on your logo.

    Border: add custom CSS

    .inside-article {
        border-radius: 10px;
    border: 2px solid #ebebeb;
    }

    Or you do these kind of stuff with Elementor, what you use on your site… 🙂

    #469019
    Cedric

    Hey,
    yeah they are really patient and I appreciate their support.
    You get the hover if you move the cursor to the bottom left of the logo, only on the subpages, not the main page.
    I want the logo to be slightly more left and remove the gap between the menu and logo if possible, I don’t want it to be entirely on the left, just a little more like this site: bitcoin.org

    As for the border it was exactly what I wanted, thanks for that!

    #469057
    Heiko

    This site has a left aligned navigation. You can do it on your own and than add CSS:

    .main-navigation .navigation-logo img {
    margin-left: 40px;
    }

    40px ist like bitcoin.org.

    edit: Your logo is an item of your navigation. So maybe the solution above will not work. Try to use the upload function of GP to insert your logo (Customizer -> Layout -> Hauptnavigation). Then you get also rid off the blue hover. The hover appears again because your logo is an item of your primary menu and get the blue hover like all your navigation items.

Viewing 13 posts - 1 through 13 (of 13 total)
  • You must be logged in to reply to this topic.