[Resolved] Navigation bar ribbon effect

Home Forums Support Navigation bar ribbon effect

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
  • #88946
    Sarah Pink

    My client has asked for the nav bar to have the ribbon effect like this one:

    Is there anyway I can do this in GP premium?

    Lead Developer
    Lead Developer

    Hi there,

    You would have to manually code this in.

    You could either use CSS, or add images inside the navigation using the generate_inside_navigation hook.

    For example:

    function generate_add_ribbons()
          <img src="LEFT RIBBON URL" class="left-ribbon" />
          <img src="RIGHT RIBBON URL" class="right-ribbon" />

    Then you could add this CSS, and adjust as needed:

    .inside-navigation {
          position: relative;
    .left-ribbon {
          position: absolute;
          left: -10px;
          top: 0;
    .right-ribbon {
          right: -10px;
          top: 0;

    Hope this helps get you started 🙂


    Hi there,

    Really enjoying the theme! Have a question: I would like to change the height of the menu/navigation bar. I have managed to change the bar height in the custom css, but than the menu items did no longer align and fell below the bar. DO you have any advice?
    My site is still private/not visible.


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