Updated on March 11, 2018 In the past, I covered Featured image below header on Pages and Posts with entry header overlay in Infinity Pro. In this tutorial, we shall implement the same in Monochrome Pro’s single posts and static Pages i.e., show featured image below the site header and overlay entry header (title on […]
Search Results for: image
Image Grid on Archives in Genesis
This tutorial provides the steps to display featured images of entries (posts) on archive pages in Genesis in a 3-column grid using CSS Grid with Flexbox fallback (for oldIE). For entries that do not have a featured image set, the first attached image will be shown and if that’s not present, a fallback image. The […]
Site Title – Image Logo in Academy Pro
This tutorial provides Academy Pro specific instructions to implement Site Title – Image Logo. Tested in Academy Pro 1.0.3. Step 1 Edit functions.php. Replace // Adds support for custom header. add_theme_support( ‘custom-header’, array( ‘flex-height’ => true, ‘header-selector’ => ‘.site-title a’, ‘header-text’ => false, ‘height’ => 160, ‘width’ => 600, ) ); with To view the […]
How to overlay site header on featured image that fades out on scroll in Genesis
This tutorial provides the steps to overlay site header (automatically sized to half the viewport height) on featured image on single posts and the image fading away on scrolling down with fading in when scrolling up in Genesis. https://sridharkatakam.com/wp-content/uploads/2018/02/hero-featured-image-fade-scroll.mp4 While the tutorial has been written for Genesis Sample, it should work with a few adjustments […]
Default page header image in Showcase Pro
In Genesis Facebook group a user asks: SHOWCASE-PRO, does anyone know how to load a default “Featured image” on Posts & Pages if none has been attributed to that post or page? This article presents the customizations in Showcase Pro 2.0.2 to display a default/fallback image for page header for Posts and Pages that do […]
Full width responsive featured image with page title overlay on landing pages in Genesis
In the comments section of Full width featured image header with page title overlay on landing pages in Genesis, a user asked: Is there a way to make this pickup responsive? Not sure what “pickup” is in this context, but assuming that the user wants to have the featured image behave responsively I’ve worked out […]
Responsive Backstretch Image in AgentPress Pro
In Genesis Facebook group a user asked, Sridhar, are you able to create a tutorial on the Backstretch header image scaling issue on mobile devices for the AgentPress Pro theme? Like in my tutorial for Digital Pro we can add the backstretch image inside the .home-featured div above the .wrap, show it only at 768px […]
Soliloquy Image Grid in WordPress
One of the reasons why I prefer Soliloquy over other slider plugins is the abundant number of hooks and filters which provide complete control of the HTML output. This tutorial provides the steps to loop through the image slides (client logos, in this example) of a Soliloquy slider and display them in a grid using […]
How to relocate post image from inside entry content in Genesis
In Genesis, by default the featured image is set to be displayed inside div.entry-content on the archives (if image display is enabled in the theme settings). Looking to move the featured image (link) out of .entry-content so it is directly underneath .entry as its first child? While the tutorial has been written for Genesis Sample, […]
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 […]
Recent Comments