[Resolved] Stream Theme (Podcasts) – Modify Theme Main Menu, add search

Home Forums Support [Resolved] Stream Theme (Podcasts) – Modify Theme Main Menu, add search

Home Forums Support Stream Theme (Podcasts) – Modify Theme Main Menu, add search

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #1570643
    Aaron

    Hello,

    The “Stream” Theme (3.02) with Current GP Premium doesn’t seem to display a Search icon in the main menu or navigation area or the off canvas menu for mobile. I see this in other themes such as in the “Health” theme.

    I have also somehow accidentally gotten rid of the “Subscribe” button from the main nav. I’m unsure how the Stream Theme subscribe button was configured.

    I would like to display the subscribe button, and then at the right (last menu item) show a search icon. I’d also like to include search and subscribe in the off-canvas menus.

    How are these two items added to the theme, main nav, and how to customize
    – Search icon / with animated search input field (this is a nice feature, I’d like to include in the “Stream” navigation for desktop and mobile/off-canvas.
    – Subscribe button – I couldn’t see where to modify/customize this other than CSS overrides in customizer.

    The Site is in a protected directory. I’ll provide details below.

    Thank you,
    Aaron Benson

    #1570933
    Elvin
    Staff
    Customer Support

    Hi,

    I have also somehow accidentally gotten rid of the “Subscribe” button from the main nav.

    Stream’s “Subscribe” button is added as a menu item along with all the other menu bar items in the nav bar. You’ll find it added under “Main Menu” on Appearance > Menus on a freshly imported Stream template.

    The overall navigation styling(including the stream button) is styled through custom CSS added in Additional CSS. It comes with the themes other settings when you import it from the Site Library template.

    Here’s the default CSS Stream adds in:

    /* GeneratePress Site CSS */ /* page title yellow icon size */
    
    .title-icon {
    	height: 22px;
    }
    
    /* h1 title letter spacing */
    
    h1 {
      letter-spacing: 1px;
    }
    
    /* main menu letter spacing */
    
    .main-navigation a {
      letter-spacing: 1px;
    }
    
    /* navigation button */
    
    .main-navigation:not(.slideout-navigation) .main-nav li.nav-button a {
      color: #ffffff;
      border: 3px solid #66ccaa;
      padding: 8px 18px;
      border-radius: 2px;
      margin-left: 24px; /* space to the left of button */
      transition: all 0.6s ease 0s;
    } 
    
    .main-navigation:not(.slideout-navigation) .main-nav li.nav-button a:hover {
    	color: #66ccaa;
    	border: 3px solid #ffffff;
    }
    
    /* add padding around mobile navigation header */
    
    .mobile-header-navigation {
      padding: 10px;
    }
    
    /* gp and wp show post meta styling */
    
    .entry-meta, .wp-show-posts-entry-meta, .wp-show-posts-entry-meta a {
    	margin-top: 6px !important;
    	color: #666666 !important;
    }
    
    /* mailchimp form styling */
    
    .mc4wp-form-fields  {
    	text-align: center;
    }
    
    .mc4wp-form input[type=text], .mc4wp-form input[type=email] {
    	line-height: 40px;
    	width: 260px;
    	border: none;
    	border-radius: 0px;
    }
     
    .mc4wp-form input[type=submit] {
    	color: #ffffff;
    	background-color: rgba(102,204,170,1.0);	
    	line-height: 40px;
    	border: none;
      border-radius: 0px;
      transition: all 0.5s ease 0s;
    }
    
    .mc4wp-form input[type=submit]:hover {
    	color: #ffffff;
    	background-color: rgba(102,204,170,0.9);	
    }
    
    @media (max-width: 768px) {
    .mc4wp-form input[type=text], .mc4wp-form input[type=email], .mc4wp-form input[type=submit] {
    		width: 100%;
    		margin: 2px;
    	}
    } /* End GeneratePress Site CSS */

    .. I’d also like to include search and subscribe in the off-canvas menus.

    You can try David’s reply here:
    https://generatepress.com/forums/topic/mobile-search-box-inside-the-navigation-menu/#post-1556266

    #1571533
    Aaron

    Hi,

    Thank you for the reply. So, to add the “subscribe” “button” styling back to an item, I’d add a custom class to the menu item and adjust styling as needed in the additional CSS.

    The main focus of my support request is to find out if I can add the search icon and animated search field to Stream as we see on the Health top menu. Can you help with that?

    Thank you,
    Aaron

    #1571877
    Leo
    Staff
    Customer Support

    Health is just using the navigation search option in the customizer:
    https://docs.generatepress.com/article/navigation-search/

    Let me know if this helps 🙂

    #1575222
    Aaron

    Hi Leo,

    Thanks, I missed the option in Customize…

    So, the interface to manage the search module in the primary menu for these GP themes is to Enable/Disable “Navigation Search”, using the option here: Appearance > Customize > Layout > Primary Navigation. Ok that’s great.

    Thanks,

    #1576376
    Leo
    Staff
    Customer Support

    No problem 🙂

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