Support › Forums › Sunshine Pro Theme › who can I make the 3 widgets same size always?
Tagged: widgets
- This topic has 4 replies, 3 voices, and was last updated 4 years, 1 month ago by
lindebjerg.
-
AuthorPosts
-
December 20, 2016 at 10:21 am #1506
lindebjerg
ParticipantHi there,
I work on this site: http://chirurg.lindebjerg.de/
On the homepage widget areas: middle- left, middle, right I have 3 text-widgets.How can I make these 3 widget areas to appear with the same height always.
The content on the homepage will not change much, but I will have more languages later on.
So setting a fix height will not be the best solution, but a solution where the biggest widget makes the height for all 3 widget areas, if possible?Best regards,
JesperDecember 20, 2016 at 12:40 pm #1507Chinmoy Paul
ModeratorDecember 21, 2016 at 11:08 am #1508lindebjerg
Participanthi Paul,
I still need some help;I have loaded the file jquery.matchHeight.js into the folder js in sunshine-pro
I wrote this into functions.php:// Load and initialize matchHeight jQuery wp_enqueue_script( 'match-height', get_stylesheet_directory_uri() . '/js/jquery.matchHeight.js', array( 'jquery' ), CHILD_THEME_VERSION, true );
but I don’t know how to use this?
Best regards,
JesperDecember 23, 2016 at 6:59 am #1509Davinder Singh Kanith
ModeratorThis is advance customization. You can refer following resources:
gist.github.com/wpsmith/3383785
sridharkatakam.com/equal-height-elements-wordpress-using-jquery-equalheights/
December 23, 2016 at 9:53 am #1510lindebjerg
ParticipantThank you Davinder,
“you must know where to find the answers;-)”Your link to sridharkatakam.com made it possible for me to understand.
Here’s how I did it, if someone else need “Equal height” in sunshine-pro:
Upload jquery.equalheights.min.js to child theme directory/js.
Create a file named say, equalheights-init.js in the same location as above having this code:jQuery(document).ready(function($) { $(window).load(function() { if (window.innerWidth > 1024) { $('.home-middle .widget-area').equalHeights(); } }); $(window).resize(function(){ if (window.innerWidth > 1024) { $('.home-middle .widget-area').height('auto'); $('.home-middle .widget-area').equalHeights(); } }); });
Add this in functions.php:
//* Enqueue scripts add_action( 'wp_enqueue_scripts', 'sk_enqueue_scripts' ); function sk_enqueue_scripts() { if ( is_home() ) { wp_enqueue_script( 'equalheights', get_bloginfo( 'stylesheet_directory' ) . '/js/jquery.equalheights.min.js', array( 'jquery' ), '', true ); wp_enqueue_script( 'equalheights-init', get_stylesheet_directory_uri() . '/js/equalheights-init.js', array( 'equalheights' ), '1.0.0', true ); } }
Best Regards,
Jesper -
AuthorPosts
- You must be logged in to reply to this topic.