adding a unique toggle menu per page

  • Hey guys, this is my first “request help” post here. If I am not following the rules about something, please let me know. :)

    I was wondering if it’s possible to make a “toggle menu” that always shows on the bottom of the page (static). Not sure if this makes any sense…

    For example: https://myteachersam.com/2016/08/07/l03-its-vampire-season/

    on this page, I have an area where it says “file download, vocabulary, discussion questions”. I have this toggle menu throughout the same page. But is it possible to have it fixed on the bottom of my page as a footer?

    The blog I need help with is: (visible only to logged in users)

  • The only way I can think of doing this is to switch to the HTML editor and give the blockquote element containing the page links an ID, in my example it is “pagelinks” like so:

    <blockquote id="pagelinks">
      <p>
        <span style="color:#327882;">
          ...

    and then using the ID to apply some styles to pin it to the bottom of the page (except on small screens where it would get in the way) and then style it a little differently so fits in with the look of your site. Once you’ve edited the post to add the ID go to the CSS section of the customiser and paste in the following code:

    @media screen and (min-width: 768px) {
      #pagelinks {
        position: fixed;
        bottom: 0;
        width: 11em;
        right: 20%;
        text-align: right;
        border: none;
        padding: 0 10px;
        background-color: rgba(255,255,255,0.9);
      }
      #pagelinks span {
        font-size: 18px!important;
      }
      #pagelinks p {
        margin: 0;
      }
    }

    Let me know what you think!

  • The topic ‘adding a unique toggle menu per page’ is closed to new replies.