WordPress.org

Ready to get started?Download WordPress

Forums

Spun
[resolved] Have the bottom widget area open by default (8 posts)

  1. hamutalwz
    Member
    Posted 9 months ago #

    I have added this line to my child theme's css:
    #secondary {display: block;}
    so now the bottom widget area is open by default.
    however, the sidebar-link is showing "+" by default and I need to change it to default to "-".
    how can I do that?
    thank you.

  2. Andrew
    Forum Moderator
    Posted 9 months ago #

    Looks like you need to enqueue a JS file with this code in it:

    jQuery( document ).ready( function( $ ) {
    
    	var $sidebar = $( '#main' );
            // Toggle sidebar on
    	$( '.sidebar-link' ).unbind( 'click' ).click( function() {
    		$( 'html,body' ).animate( { scrollTop: $( "#secondary" ).offset().top },'slow' );
    		$sidebar.find( '#secondary' ).slideToggle( 'ease' );
    		$(this).toggleClass( 'toggled-on' );
    		if ( $(this).hasClass( 'toggled-on' ) )
    			$(this).text( '+' );
    		else
    			$(this).text( '-' );
    	} );
    });

    http://codex.wordpress.org/Function_Reference/wp_enqueue_script

  3. hamutalwz
    Member
    Posted 9 months ago #

    not sure how to implement this.
    isn't there a way to modify the existing PHP or JS files?
    Thank you.

  4. hamutalwz
    Member
    Posted 9 months ago #

    I've impelemented the jQuery and enqueued it and although it does change the "+" and "-" symbols as they should be when clicked, it does not change the default state the site loads in.
    by default, the site loads with the bottom sidebar open but the link shows "+" when it should show "-".
    when I click it, it closes the bottom area and the symbol remains "+".
    so when I click it again, it now opens and the symbol is "-" as it should be.
    how can I make the default state to be "-"?
    Thank you.

  5. Andrew
    Forum Moderator
    Posted 9 months ago #

    Try something like this outside of the click event:

    $( '.sidebar-link' ).text('-');

    Btw it would help if you could link the page in question

  6. hamutalwz
    Member
    Posted 9 months ago #

    not sure where to add this line. where is "outside the click event"?
    this is the url: http://www.private.fsh.co.il
    thanks.

  7. Andrew
    Forum Moderator
    Posted 9 months ago #

    Instead of this:

    jQuery( document ).ready( function( $ ) {
    
    	var $sidebar = $( '#main' );
            // Toggle sidebar on
    	$( '.sidebar-link' ).unbind( 'click' ).click( function() {
    		$( 'html,body' ).animate( { scrollTop: $( "#secondary" ).offset().top },'slow' );
    		$sidebar.find( '#secondary' ).slideToggle( 'ease' );
    		$(this).toggleClass( 'toggled-on' );
    		if ( $(this).hasClass( 'toggled-on' ) )
    			$(this).text( '+' );
    		else
    			$(this).text( '-' );
    	} );
    });

    Use this:

    jQuery( document ).ready( function( $ ) {
    
            $( '.sidebar-link' ).text('-');
    	var $sidebar = $( '#main' );
            // Toggle sidebar on
    	$( '.sidebar-link' ).unbind( 'click' ).click( function() {
    		$( 'html,body' ).animate( { scrollTop: $( "#secondary" ).offset().top },'slow' );
    		$sidebar.find( '#secondary' ).slideToggle( 'ease' );
    		$(this).toggleClass( 'toggled-on' );
    		if ( $(this).hasClass( 'toggled-on' ) )
    			$(this).text( '+' );
    		else
    			$(this).text( '-' );
    	} );
    
    });
  8. hamutalwz
    Member
    Posted 9 months ago #

    Thank you!
    works perfect.

Reply

You must log in to post.

About this Theme

About this Topic

Tags

No tags yet.