Front Page 1 section of Atmosphere Pro uses Backstretch for its background image and is hence not responsive. Left and right side of the image will get cut off as we reduce the viewport width. This tutorial provides the steps to disable Backstretch and setup the Front Page 1 image inline i.e., as a regular […]
Search Results for: youtube
How to add a button to Primary navigation that opens full screen widget area in Genesis
In the past, I wrote about Infinity Pro’s Offscreen widget area in any Genesis child theme. In this tutorial, we shall adapt Infinity Pro’s Offscreen widget area in News Pro. We are going to add a font icon button at the end of Primary navigation’s menu which when clicked will open the widget(s) in a […]
Rotating background images in Front Page 1 section of Atmosphere Pro
In one of my earlier tutorials titled Front Page 1 background slider in Infinity Pro using Featured Galleries and Backstretch I showed how we can send multiple images uploaded to a gallery attached to the Homepage to Backstretch initialized on Front Page 1 widget area. In this article, I share the steps to implement the […]
Horizontal Submenu in Genesis
Looking to display submenu items horizontally when a menu item is hovered upon in Genesis? Screencast: We can set the .sub-menu to be 100% wide and anchored to the right so the submenu items appear full width with the first item in the submenu aligned at the left edge of the screen. The trick to […]
How to add an expandable search icon to the navigation in Infinity Pro
Updated on May 16, 2018 In Genesis Facebook group a user asked: How do you add a search form to your Genesis theme (in your nav bar)? (I googled the same question and a whole lot of different answers came up). I read that this used to be included and now you can add some […]
How to replace Front Page 1 background image with an inline image at smaller widths in Altitude Pro
Altitude Pro’s Front Page 1 section uses a full screen background image on which the widget appears. One problem with centered cover background images is that they will be cut off at left and right sides on smaller widths. We can get around this by adding the background image inline in the HTML, hiding it […]
Posts grid on archives with title and excerpt on hover in Genesis
In my tutorial requests Trello board, a user asked: Hi Sridhar, how would you approach having an archive page for each taxonomy of a CPT? I started with https://sridharkatakam.com/grid-portfolio-images-title-excerpt-hover-showcase-pro/ , but there wasn’t a clear way to setup a separate page for each taxonomy. Thanks!! Archive pages for taxonomies are usually enabled by default and […]
particles.js in Business Pro
In the comments section of particles.js in Genesis, a user asked: Happy New Year Sridhar! Iām very interested in implementing this on the header hero image section of the Business Pro Theme. Which adjustments would I need to make on step 3, step 4 ? Thank you This tutorial provides the steps to implement particles.js […]
How to set up a Sticky widget in Genesis
Did you know that it is possible to make any element sticky or fixed as it is scrolled to and have it “bottom out” so it never leaves its container (no more worrying about accidentally covering the footer) using CSS alone? Thanks to Tim Jensen, today I learned about position: sticky which is quite powerful […]
How to move Search icon out of nav menu next to the hamburger menu icon in Monochrome Pro
A user asked, Monochrome Pro has a nice search implementation in the header but it is not visible on mobile view. It would be nice to pull it out of the menu and display it as a standalone item next to the hamburger menu on mobile view. A tutorial on how to do that would […]
Recent Comments