WordPress.org

Support

Support » Themes and Templates » [Resolved] Insert a (easing slider lite) to pilcrow header

[Resolved] Insert a (easing slider lite) to pilcrow header

  • ilevelmf@charter.net
    Member

    @ilevelmfcharternet

    I’m trying insert a slider (easing slider lite) into my header.
    I’m not sure where to place the code in the header php.
    Any help would be much appreciated…thx

Viewing 10 replies - 1 through 10 (of 10 total)
  • paulwpxp
    Font hero

    @paulwp

    All modifications that need template editing need to be done via child theme.
    http://codex.wordpress.org/Child_Themes

    Once you got the child theme up and running, copy over header.php into it and replace this block of code starting from line#45 to line#58
    http://themes.trac.wordpress.org/browser/pilcrow/1.5.1/header.php

    <div id="pic">
    	<!-- lots of stuff here -->
    </div><!-- #pic -->

    with this

    <div id="pic">
    	<?php if ( function_exists( "easingsliderlite" ) ) { easingsliderlite(); } ?>
    </div><!-- #pic -->

    This is a link to plugin installation page for reference of function name.
    http://wordpress.org/plugins/easing-slider/installation/

    ilevelmf@charter.net
    Member

    @ilevelmfcharternet

    First of all thanks so much for your quick response. I’m a graphic designer with enough css knowledge that can make me dangerous. And obviously not enough to solve all of the problems.

    I did already have my child theme in place and had copied the header.php into my child theme(dumb luck on my part).

    I proceded to make the changes to the code and got a couple of unexpected outcomes.
    1… The navigation doesn’t work.
    2…There’s no bottom padding in the new slider div and the text/post and the sidebar info move up & under the slider div about a 1/4in.

    here’s the site…http://www.theframemakerclarksville.com/

    Can’t seem to find where to make the padding adjustments and the I’m blank on the navigation.

    Any thoughts…thx

    paulwpxp
    Font hero

    @paulwp

    The reason is that #nav is floated, so the #pic needs a clear.

    /* ----- clear because of floated #nav -----*/
    #pic { clear: both; }

    Use this selectors to control the position of arrows, or display none if not wanted.

    /* ----- change the value as needed -----*/
    #pic .easingsliderlite-prev.outside { left: -40px; }
    #pic .easingsliderlite-next.outside { right: -40px; }
    paulwpxp
    Font hero

    @paulwp

    Please remove CSS code from header.php, and put in child theme stylesheet.

    ilevelmf@charter.net
    Member

    @ilevelmfcharternet

    My ignorance is showing…Where do I place this clear?
    Every place I tried was wrong.
    Thanks for your patience.

    Not a big fan of the arrows, thanks for the tip.

    paulwpxp
    Font hero

    @paulwp

    The code must be used in child theme stylesheet, the file is style.css in child theme folder reachable via Appearance > Editor > style.css when child theme is active.

    ilevelmf@charter.net
    Member

    @ilevelmfcharternet

    I’m sorry, I’ve got everything set up in my child theme, I just don’t know exactly where to place this code…

    /* —– clear because of floated #nav —–*/
    #pic { clear: both; }

    you’ve been very helpful.

    paulwpxp
    Font hero

    @paulwp

    Things you must do.

    • Delete php code from child theme stylesheet.
    • Clean up child theme stylesheet, leave in only needed CSS code.
    • Put that code in.

    Are those CSS in child theme stylesheet put there by you ? Are those for customization, code to overwrite parent style ? If not, delete it.

    The php code must not be in stylesheet, so delete it.

    In case, you don’t have any customization works in this stylesheet that needs to be saved at all, do this.

    1. Go here Appearance > Editor and click on style.css
    2. Delete everything in it, don’t click save yet.
    3. Copy this code below and paste into it and click save.
    /*
    Theme Name:     pilcrow-child
    Description:    Pilcrow child theme
    Author:         admin
    Template:       pilcrow
    */
    
    /* ----- this line must be here always -----*/
    @import url("../pilcrow/style.css");
    
    /* ----- clear because of floated #nav -----*/
    #pic { clear: both; }
    ilevelmf@charter.net
    Member

    @ilevelmfcharternet

    Mucho thanks…I’ll be back on it tomorrow…

    ilevelmf@charter.net
    Member

    @ilevelmfcharternet

    It’s soup!

    Thanks so much you’ve been very helpful.

    I did make some customizations in the code to overwrite the parent.
    There might be a couple of unnecessary lines but not much. I’ll try and clean up.
    Good or bad I’m responsible for any mess.

    Again, thanks for all of your help. Excellent problem solver.

Viewing 10 replies - 1 through 10 (of 10 total)
  • The topic ‘[Resolved] Insert a (easing slider lite) to pilcrow header’ is closed to new replies.