This coded solution for the Authority Pro child theme by StudioPress, enables you to move the home page image before the title and text on mobile screens rather than the default which shows the image after the content.
The code enables you to change the position of any element when in different columns in any container using CSS.
Demo Video
Shows the home page image in the first section moved to display before the intro text on mobiles.
Tested using the Authority Pro child theme by StudioPress however will work in any theme by changing the selector classes to match for the container and columns 1 and 2.
Installation
There’s only 1 step :
Copy and paste the CSS to the end of your Authority Pro child themes style.css file and clear caching.
The code in this download folder enables you to use a different featured image on single posts to the image displayed on archive pages.
Archive Page
Single Post
You can choose from 2 options to add your custom image using WordPress custom fields or ACF.
Demo Video
Shows you how to add a unique featured image for display on single posts which is different to the image shown on archive pages.
Tested using the Authority Pro child theme by StudioPress.
Installation Steps
There’s 1 – 2 steps :
# Upload the file named featured-images.php to the Authority Pro themes lib folder overriding the default file of the same name.
# Add your single post image on the Edit Post screen using custom fields native to WordPress or ACF. See instructions below under the Add Image sub heading.
Create a custom field named single_image and add the link for your image to the value field like this :
If you want to use ACF to add your image, import the file named 72894-acf.json using the ACF plugins > Custom Fields > Tools > Import field.
You’ll also need to remove or comment out the code on line 29 of image-functions.php and uncomment the code on line 41. This option allows you to use the Customize > Theme Settings > Content Archive > Featured Image Size settings to select the single-featured-image size like you see in this screenshot :
This tutorial shows you how to copy the front page template using the Gutenberg editor.
In this download, you’ll get a copy of the Gutenberg template for Genesis which you can use in any Genesis child theme to copy the front page template of the same child theme.
This way you can use the front page template on unlimited pages with unique content for each page.
A member of the Genesis community recently sent this message :
I am reading your posts and they are great, here you have a new member on January 1st, if I subscribe now I forget about Christmas 🙂 I’m trying to create the post on the front page as copyblogger.com does. I love it, do you think you can do a tutorial of those? If you tell me if I subscribe tomorrow. Thank you
Here’s what you can do using the Genesis Sample child theme to replicate how Copyblogger.com display posts on their front page :
The download package includes CSS for media queries so each entry displays in a single column on smaller screens, as seen in the following demo video :
Shows a similar layout to the front page of the Copyblogger website which you can use in any Genesis child theme. Note : The code may need modification for usage in other Genesis child themes.
Tested using the Genesis Sample & Authority Pro child themes ( works without any modification ).
This tutorial provides the steps to modify the code so you can conditionally remove the social menu from specific pages in Authority Pro.
Based on this question from a member of the Genesis community :
I need to conditionally remove / hide the Social Menu (along left hand side of page) for a specific page. The conditional argument is no problem, however I cannot find the hook for the social menu and the do_action argument for the social menu.
Shows how to add a conditional tag to the existing function authority_do_social_menu in order to remove the social menu from displaying on specific pages.
In the Authority Pro themes functions file, you’ll find the PHP code for the social menu between lines 276 – 293 which adds the third menu on all pages of the Authority Pro theme.
This tutorial removes the hero portrait Image setting from the Authority Pro settings in the customizer and adds a hero video setting enabling you to upload a video, select a video from the media library or add a externally hosted video link.
You can also add a thumbnail image which is displayed like a video poster with a play button overlaying the image as seen in the following demo video.
There’s 4 steps relating to usage of the files in the download folder :
Step 1 : Upload the customize.php file to the authority-pro > lib > customize folder replacing the default customize.php file.
Step 2 : Copy & paste the PHP code from the helper-functions.php file to the end of the authority-pro > lib > helper-functions.php file.
Step 3 : Upload the hero-section.php to authority-pro > lib > templates folder replacing the default hero-section.php file.
Step 4 : Upload the hero-style.css file to the authority-pro > css folder replacing the default hero-style.css file.
You can then upload your video and/or video thumbnail image using the customize > Authority Pro Settings > Hero Video Settings as seen in the demo video.
And set a default thumbnail image named hero-video-thumb.jpg in your child themes images folder.
This template produces exactly the same result as this older template however is far easier to setup.
This version requires the use of the ACF plugin unlike the previous version which uses WordPress custom fields.
Once you install the template, you can import the json file from the download folder into ACF and your fields and demo content for each field is setup automatically.
In your WordPress Dashboard go to Custom Fields > Tools > Import Field Groups and you’ll find the box to select the json file for import.
Here’s 1 example of what the template produces after importing the ACF json file :
The template also includes a unique widget area for the eNews subscribe widget in the hero section and a unique footer widget area independent of the front page.
Watch the demo video to see unique content displays on a single page using the template.
Video Demo
Shows a single using the template which shows unique content in the same way the front page template works.
This tutorial helps you add a slider to the front page template in the Authority Pro theme by StudioPress.
In this case we replace the front page hero section with the slider and reposition it using the genesis_after_header hook from the genesis_before_content_sidebar_wrap hook.
This template enables you to display unique content for each single page which uses the the template.
Update : This new version enables you to setup all the fields and demo content in 1 click.
This includes :
Hero title
Hero description
Hero portrait image
Hero portrait caption
All elements of the 5 main template sections
The blog title
The blog description
The bog button text & link
All elements of the featured posts
The template also includes a unique widget area for the eNews subscribe widget in the hero section and a unique footer widget area independent of the front page.
Watch the demo video to see unique content displays on a single page using the template.
Video Demo
Shows a single using the template which shows unique content in the same way the front page template works.
Step 1 : Upload the file named replicant.php to the Authority Pro themes root directory and select the template named Front Page Replicant from the templates drop down menu i n the Page Attributes box on any Edit Page screen.
Step 2 : Upload the file named heros.php to the Authority Pro themes root directory.
Step 3 : Copy & paste the PHP code from the functions file to the end of the Authority Pro themes functions.php file.
Step 4 : Copy & paste the CSS from the style-front.css file inside the css folder to the Authority Pro themes style-front.css file and clear caching.
You’ll then need to add content for the template using the instructions below for registered users.
This tutorial extends the code in this tutorial and enables you to display unique content on each & every hero section displayed on any number & type of inside pages.
Each element in each hero section can be customized so its unique on every page or post the hero is shown.
If no unique content is added, the default content used in the front page hero section is displayed as you can see in the following demo video :
Demo Video
The demo shows how unique content has been added to the hero section elements displaying on a single page and the default elements are displayed on a single post.
Unique content which can be added in each hero includes :
Title
Description
Image
Caption
Logo Images
Code Installation
There’s 3 steps :
Step 1 : From the download folder, upload the file named heros to your child themes root directory.
Step 2 : From the download folder, copy & paste the PHP code from the functions.php file to the end of the Authority Pro themes functions.php file.
Step 3 : From the download folder, copy & paste the CSS from the file named style-hero.css to the end of the css > style-hero.css file inside the Authority Pro theme folder.
Register or login to access the download folder for members :
This tutorial provides the code which enables you to display featured images on single pages exactly the same as they’re displayed on single posts when using the Authority Pro child theme by StudioPress.
There’s 3 steps :
Step 1 : Go to authority-pro > lib > featured-images.php and modify line 44 like this :
You can add default images in the Authority Pro themes images folder for each widget area and name them front-page-1.jpg, front-page-3.jpg & front-page-5.jpg like this :
You can also change the default images via the customizer.
Note : The code in this tutorial should work in any Genesis child theme enabling you to add background images to existing front page widget areas.
Step 1 : From the download folder, copy & paste the PHP code from the functions.php file to the end of the Authority Pro themes functions file.
Step 2 : From the download folder, upload the folder named custom-js to the Authority pro themes root directory.
Step 3 : From the download folder, upload the modified version of the front-page.php file to the Authority Pro themes root directory replacing the default front-page.php file. This file is commented showing exactly where the custom code has been added.
You can then add default images to the Authority Pro themes images folder and replace them via the customizer.
Register or login to access the download folder for members :
Do you know if there’s an easy way to make the front page widget areas on the new Authority Pro theme full-width. Currently they’re limited to 1280px. I’d like to have full-width backgrounds on each of those front page widget area.
And here’s the result showing a background color added to the front page 1 widget area which displays full width of the screen at all screen widths :
Here’s the CSS you simply paste at the end of the Authority Pro themes style.css file.
This code enables you to display the hero section from the front page of the Authority Pro theme to any inside pages or posts. Simply use a conditional tag in the code to control exactly where it displays.
The Authority Pro theme is the latest in a range of nearly 100 themes included in the Pro Plus package by StudioPress themes.