A client recently asked if I could put together a step-by-step tutorial on how to add a new widget to the front page of the Digital Pro theme. She loves the Digital Pro theme (as do I) and wanted an option for an opt-in widget just below the hero image. In case you’d like to do the same, here is the step-by-step tutorial.
Disclaimer: This post contains affiliate links, which means I may earn a commission if you click them and make a purchase. This is at no cost to you and I only share products that I use and love myself.
Below is a step-by-step tutorial on how to add a new widget to the front page of the Genesis Framework Digital Pro child theme. In this tutorial, I will add a new widget below the ‘Front Page 1’ widget, which will appear below the hero image. The new widget will be called ‘Front Page Opt-in’.
NOTE: This tutorial includes making edits to several php files, so please be careful as editing php files can break your site if done incorrectly. I recommend you edit your php files via ftp in order to make any fixes if necessary. Alternatively you can edit some theme files via the backend Editor.
Step 1: Navigate to the functions.php file (via ftp, file manager or Editor) – image below show the location of the functions.php file via ftp.
Step 2: Open the file with a text editor and scroll all the way to the bottom and find this section:
Step 3: You’re going to add a new ‘genesis_register_sidebar’ section in-between Front Page 1 and Front Page 2.
Step 3 continued: Note the new section ‘Front Page Opt-in’ in-between ‘Front Page 1’ and ‘Front Page 2’. Copy and paste this new ‘genesis_register_sidebar’ section into your functions.php file.
Step 4: Save the file
Step 5: From the backend of your site, click on Appearances and then Widgets
Step 6: You should now see the new widget called ‘Front Page Opt-in’
Step 7: Next, you need to indicate where you want to add the content of the new widget
Step 8: Navigate to the front-page.php file (just underneath the functions.php file)
Step 9: Open the file and scroll about 3/4 of the way down and find this section:
Step 10: You’re going to add a new ‘genesis_widget_area’ in-between ‘front-page-1’ and ‘front-page-2’.
Step 10 continue: Note the new section ‘front-page-optin’ in-between ‘front-page-1’ and ‘front-page-2’. Copy and paste this new ‘genesis_widget_area’ section into your front-page.php file.
Step 11: Save the file
Step 12: From the backend of your site, click on Appearances and then Widgets
Step 13: Add your content in the new widget area and style as normal 🙂
Hopefully this was worthwhile. As with most things in the WordPress world, there are multiple ways to accomplish the same goal; this is one way. Feel free to drop any questions or comments in the comment box below and I’ll be happy to help. Also, let me know if you’d like a detailed tutorial on adding widgets (to the front page or other pages/posts) for another Genesis child theme.
Disclaimer: This post contains affiliate links, which means I may earn a commission if you click them and make a purchase. This is at no cost to you and I only share products that I use and love myself.
Leave a Reply