In Beautiful Pro the .site-header-banner div has background image set via CSS and as such is not responsive. It is possible to make image backgrounds responsive but I personally prefer to just “embed” images vs using them as backgrounds and using CSS/JS to make them responsive. Just feels more natural and the proper way of […]
responsive
Posts in columns with oEmbed support for excerpts on homepage in Dynamik
To view the full content, please sign up for the membership. Already a member? Log in below or here.
Making YouTube videos responsive when using Dynamik
On a website I am currently working on the active theme is Dynamik, a commercial child theme for Genesis. There’s a YouTube video in the content on homepage inserted via the WordPress oEmbed that automatically inserts the player by detecting video URL in the following format: http://www.youtube.com/watch?v=4EErMxbKhLM The video is not responsive at smaller widths […]
Adding a responsive side menu in Genesis using Sidr
In this article I show how Sidr can be used to display Primary Navigation menu items in the left side when a hamburger menu icon font link is clicked. I am using Genesis Sample as the active theme in this example. Here’s the flow: Primary navigation bar appears in its entirety at screen width of […]
How to make Header menu in Genesis mobile responsive similar to that in Beautiful Pro
Update: Current latest version of this tutorial is here. A user asked in ‘Genesis WordPress’ Facebook group: Sridhar – or anyone else – does someone have a code snippet I can use to change the way the navigation displays on the Agency theme on smaller screens – I like the look of the nav for […]
How to add a widget section with a responsive background image below header in Minimum Pro
In one of my earlier posts titled Overlaying text on background image in Minimum Pro – Part 2, I provided the steps to overlay text that appears below site header on homepage’s background image. In this article I am going to explain how to set the image uploaded in the dashboard as a background to […]
Adding a responsive logo in Metro Pro
To view the full content, please sign up for the membership. Already a member? Log in below or here.
Different banner images for different Pages in Genesis
This is a continuation of my earlier post titled How to add a responsive image above site header in Genesis. Here’s the summary of what the code in this article does: displays header.jpg from child theme’s images directory above .site-header. This image will be linking to site’s homepage and will appear on most pages of […]
How to add a responsive image above site header in Genesis
To view the full content, please sign up for the membership. Already a member? Log in below or here.
How to add a responsive Header image in Metro Pro
Updated on December 23, 2015 The earlier method is here just for reference. The new method below is recommended. Screenshots Desktop view Tablet view Mobile view Step 1 Add the following in Metro Pro’s functions.php: To view the full content, please sign up for the membership. Already a member? Log in below or here.
Recent Comments