Lay Theme Forum

    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Popular
    • Users
    • Search

    Site title in menu

    General Discussion
    2
    10
    420
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • J
      jvonc last edited by

      I’m building a site where the site title is on the topleft and behind it in the same line the menu is following.

      I’m looking for a solution to add the site title into the menu to prevent the weird changing gap between site title and menu. (Somehow the distance between the both is changing within different resolutions...)

      I already tried to ad a custom link to the menu but wasn’t able to change then afterwards the look and target of this one particular element via custom css/html.

      Is there maybe an easier way?

      This is how it should look like in the end – but here are the two elements still separated as Site Title and Menu:
      alt text

      1 Reply Last reply Reply Quote 0
      • mariusjopen
        mariusjopen Global Moderator last edited by

        Dear @jvonc
        can you post a link to your website?

        One idea would be to use CUSTOM CSS for this.

        Best!

        Marius

        www.mariusjopen.world

        1 Reply Last reply Reply Quote 0
        • J
          jvonc last edited by

          Hi @mariusjopen,

          you can find the website under: of.jonascarstens.com

          I tried some things in Custom CSS/HTML but didn’t came to a solution how to add the site title to the menu.

          Best
          j.

          1 Reply Last reply Reply Quote 0
          • mariusjopen
            mariusjopen Global Moderator last edited by

            Dear @jvonc

            does that help?

            .laynav.primary {
                left: 36vw;
                padding-top: 1px;
            }
            

            Best!

            Marius

            www.mariusjopen.world

            1 Reply Last reply Reply Quote 0
            • J
              jvonc last edited by

              Hi @mariusjopen,

              thanks for that – but unfortunately this doesn’t solve my problem.

              I want to embed the site title into the unit of the menu to have everything in a straight line.

              The closest I got so far was to add a custom link to the menu and name it like the site title. But I didn’t found a solution to change the look of that custom link.
              In this case I would get rid of the site title entirely.

              Best
              j.

              1 Reply Last reply Reply Quote 0
              • mariusjopen
                mariusjopen Global Moderator last edited by

                @jvonc
                with the code I sent you - I got it in one line.

                Try to add !Important to the CSS.
                It should be doable in CSS:

                Best!

                Marius

                www.mariusjopen.world

                1 Reply Last reply Reply Quote 0
                • J
                  jvonc last edited by

                  @mariusjopen

                  The only thing that happens when I put this code into the Custom CSS is that the menu gets a larger distance to the site title:

                  alt text

                  Of course I could change the distance in the code, but the "Space left" of the site title is set in % so that’ll change whenever the screen has a different resolution. So that wouldn’t really solve the problem besides on my own screen.

                  What I want is to have the same distance between "Ossian Fraser" and "Works" as between every other menu element. In the customizer it’s only possible to set the distance the the edge of the website – is it maybe somehow possible to set this as a relation to the site title?

                  Best
                  j.

                  1 Reply Last reply Reply Quote 0
                  • mariusjopen
                    mariusjopen Global Moderator last edited by

                    Dear @jvonc

                    this is responsive:

                    .laynav.primary {
                        left: 36vw;
                        padding-top: 1px;
                    }
                    

                    this would be exact pixels:

                    .laynav.primary {
                        left: 100px;
                        padding-top: 1px;
                    }
                    

                    You can adjust it like you want.
                    And then with media queries you could adjust it for mobile.
                    I would do that.

                    Best!

                    Marius

                    www.mariusjopen.world

                    1 Reply Last reply Reply Quote 0
                    • J
                      jvonc last edited by

                      Hi @mariusjopen

                      I finally figured out how I solve my problem. Your code was helping indeed:

                      .laynav.primary {
                          left: calc(5vw + 140px);
                          padding-top: 1px;
                      }
                      

                      With that workaround I make sure that the distance to the site title is always the same.

                      Best
                      jonas.

                      1 Reply Last reply Reply Quote 0
                      • mariusjopen
                        mariusjopen Global Moderator last edited by

                        Dear @jvonc
                        ha! The good old calc :-)

                        Best!

                        Marius

                        www.mariusjopen.world

                        1 Reply Last reply Reply Quote 0
                        • First post
                          Last post

                        Before you post

                        Use the Search Feature. Maybe there is already a solution to your issue.

                        1. Update Lay Theme and all Lay Theme Addons
                        2. Disable all Plugins
                        3. Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code ", click "Save Changes"
                        4. Now see if your problem solved itself
                        5. Go here, see if your problem is listed here:
                        Troubleshooting

                        When you post:
                        1. Post a link to where the problem is
                        2. If the problem is difficult to explain, post screenshots / link to a video to explain it

                        Thanks!

                        Online Users

                        Recent Topics

                        • N

                          website blank.

                        • S

                          Theme crashed - because of Polylang?

                        • S

                          New fade-in / opacity bug?

                        • A

                          Unable to update lay theme / to login wp admin

                        laytheme.com