WordPress.org

Ready to get started?Download WordPress

Forums

Additional Style Sheet Help Please (9 posts)

  1. David_1
    Member
    Posted 2 years ago #

    Hello Friends,

    I wonder if someone has a minute they could assist me.
    I am using my child of Twentyten.
    I have put a separate css, I call (main.css) into each page of my WordPress website.

    However the client views each page in the "Visual" setting not the "HTML" setting to make her changes to the page's.

    Problem: when she does this, the style sheet for the page, which I have a link to as the following:
    <link href="http://i-brand.ca/testsite/wp-content/themes/twentyten-child/main.css" rel="stylesheet" type="text/css" />

    This link vanishes from the page which leaves the page she is editing un-styled. (No style sheet link). In other words no reference to my main.css.

    Since my file main.css is applicable to all the pages in the website. Can it be placed in my Child.css somewhere or does anyone know of the best way to get the styles I have written in my file called main.css to effectively manage each page like my Child-style.css.

    I think the easiest way to be to add the styles of the file main.css to the Child.css, but can this be done and where and how would I do this?

    Many thanks in advance for anyone who can offer some assistance or help with this. Client is very upset and I am trying very hard to help them.

    Website: http://i-brand.ca/testsite/
    Thank you for your help.

  2. weslinda
    Member
    Posted 2 years ago #

    You should hook the CSS in the theme, not through the individual page. This way you only have to hook the file once, and then you can update at will.

    You can add the code for the stylesheet in header.php

  3. David_1
    Member
    Posted 2 years ago #

    Weslinda,

    Thank you SO very much I will try this.
    So I can copy and paste my main.css style into the header.php file?

    I have a copy of the header.php in my Child folder should I put in that one or the Twentyten folder?
    Also can it be pasted into the header.php at any place, or is here a preferred location in the header.php file?

    AND thank you very, very much I sure do appreciate your help!

  4. David_1
    Member
    Posted 2 years ago #

    Hello again Weslinda,

    Sorry for asking this but what exactly do you mean by "hook", when you say "I could hook the file?"

    Hope I am not a bother, I am despirately trying to rememdy this and I really appreciate your help emmensly!

  5. weslinda
    Member
    Posted 2 years ago #

    The link you are using in each page, drop that into the header.php file. In the child theme is best. Location doesn't matter, just needs to be inside the <head> tags.

    One key is that it should be below the link to the main style sheet for the theme.

  6. You could add it to your CSS.

    In style.css put in:

    @import url("main.css");
  7. David_1
    Member
    Posted 2 years ago #

    Hello Weslinda and Ipstenu,

    I cannot thank you enough for your help.

    Unfortuantely I am still stuck.
    I placed the following:

    @import url("main.css");

    at this point in the Child header.php file...

    /* We add some JavaScript to pages with the comment form
    * to support sites with threaded comments (when in use).
    */
    if ( is_singular() && get_option( 'thread_comments' ) )
    wp_enqueue_script( 'comment-reply' );

    /* Always have wp_head() just before the closing </head>
    * tag of your theme, or you will break many plugins, which
    * generally use this hook to add elements to <head> such
    * as styles, scripts, and meta tags.
    */
    wp_head();
    ?>
    @import url("main.css");
    </head>

    <body <?php body_class(); ?>>
    <div id="wrapper" class="hfeed">
    <div id="header">
    <div id="masthead">

    Can I ask, what you think may be the trouble still?

    Should I be maybe trying to do this at some place in my child-style.css?

    Thank you both for your attempt to help mer I cannot thank you enough truly!

  8. weslinda
    Member
    Posted 2 years ago #

    The @import would go in the other CSS file, if you are putting a link in the header.php you'd put

    <link href="http://i-brand.ca/testsite/wp-content/themes/twentyten-child/main.css" rel="stylesheet" type="text/css" />

  9. David_1
    Member
    Posted 2 years ago #

    Gentlemen,

    Did I just get it?
    I am praying I did.

    What I just did was I took your code Ipstenu (@import url("main.css");) and placed it into my Child style.css as below...

    /*
    Theme Name: Twenty Ten-Child
    Description: Child theme for the Twenty Ten theme
    Author: David M - iBrand
    Template: twentyten
    */
    
    @import url("../wp-content/themes/twentyten/style.css");
    @import url("main.css");

    It does seem to be working. Keep my fingers crossed.
    To both of you, THANK YOU very, very much!
    You help has really been invaluable and I truly hope this post and your efforts can help someone else with linking up stylesheets.

    Thank you both again very kindly!

Topic Closed

This topic has been closed to new replies.

About this Topic