WordPress.org

1. britgirl
   Member
   Posted 5 years ago #

   I have downloaded the SRG clean arcives plugin, created an archives page (following the create template directions for creating anArchive) and set up a new class for displaying postspermonth by the plugin.

   However, I just have been unable to get the month headers to indent the way I would like them to. At the moment they go right up to the edge of my page and doesn't look good - as does the search form on the new Archive page. I know it is something I have to add to the stylesheet, but I have no idea what to change or where to put it. I am pretty new to editing files (and to hosted blogging) and this has got me stumped. I have also had a look at the page source for others who have got the plugin working, and tried to add a couple of lines of code to the Archive page, but it got stripped out. I just want to be able to control the margin on this page, which seems to be outside the control of the overall layout.
   Here is my archives url http://thebritgirl.com/archives

   Grateful for some (idiot proof) direction.
   Thanks.

2. vkaryl
   Member
   Posted 5 years ago #

   Well, would be easier if I hadn't upgraded to FF2.0 and so no longer have aardvark available, but it looks like you might need to add a specific h2 for the archives - in other words, set up a class like:

   .srg h2 {
   padding-left:10px;
   }
   (and of course you can tweak that setting.... - and it might even need to be margin-left - without the right "tools" I can't edit like normal on your page, sorry!)

   Then in the archives setup page, you'd add class="srg" to the h2s that make the month and year titles.

   In order to not let code get stripped, you have to disable the RTE/wysiwyg: access your profile in wp-admin/users, scroll to the bottom, uncheck the box at the left.

3. moshu
   Member
   Posted 5 years ago #

   Your archives Template seemingly is missing the
   div class="post" bit that is there on other Pages and posts.
   Add it to the template around the code that displays the archives list.

4. britgirl
   Member
   Posted 5 years ago #

   Thank you both for such a quick response... I will try these out.

5. Les Bessant
   Moderator
   Posted 5 years ago #

   @vkaryl - this page might get your Aardvark back

6. vkaryl
   Member
   Posted 5 years ago #

   LesBessant, consider yourself kissed! Thank you - I looked a week back or thereabouts, but then had a boot drive crash and never got back to look again, so I am EXTREMELY grateful!

7. britgirl
   Member
   Posted 5 years ago #

   Hi - I tried everything above... nothing worked, I still have the headers squashed up against the left margin. I set up an srg class and tried different margin-left variables
   as follows
   }

   .srg h2 {
   padding-left:5px;
   margin-left:10em 0 0 0;
   }
   but no luck. I even set the margin to auto, but nothing changed. Adding in the "Post" info made the headers the same as throughout my blog (h2) and I can reduce them later once I know why I can't change the margin.(looks fine on everyone else's site) Can't figure out what I'm doing wrong here.
   Any other suggestions welcome. Thanks.

8. vkaryl
   Member
   Posted 5 years ago #

   Well, hmmm. Try some tighter specificity? Like

   .post.srg h2 {
padding-left:10px;
}

   Um. Looks like maybe the css for your plugin is in the head of the page. Maybe try moving it into the normal stylesheet, or add the .srg h2 stuff into it instead of the normal stylesheet?

9. britgirl
   Member
   Posted 5 years ago #

   Do you mean in the head of the archive page? I tried doing this - adding the srg h2 to the archive, no success. Nothing has worked so far.

10. vkaryl
    Member
    Posted 5 years ago #

    Did you try taking all the style info OUT of the head of the archive page and put it into the normal stylesheet?

11. KatGirl
    Member
    Posted 5 years ago #

    I tried this and it worked via FF web developer tools...

    .time_description {
    margin-top:80px;
    margin-left:20px;
    }
    .srg {
    margin-left:20px;
    }

    Original Source View - Archives

    <p><div class = "time_description"><h2>Archives by month</h2></div></p>

    <p> <form method="get" id="searchform" action="http: //thebritgirl.com/">
    <p>
    <input size="12" type="text" value="" name="s" id="s" /><input class="btn" type="submit" id="searchsubmit" value="Search" />
    </p>
    </form>
    </p>
    <h3 class= "srg"> <a href='http://thebritgirl.com/2006/11/' title='November 2006'>November 2006</a></h3>

12. britgirl
    Member
    Posted 5 years ago #

    thank you, I will try this. I appreciate everyone's help!

13. britgirl
    Member
    Posted 5 years ago #

    Hi Kat - should this be placed in the Archive page or the stylesheet (style.css)? I tried it in the stylesheet (probably in the wrong place) and it screwed up my header. I've replaced the style sheet.

    Vkaryl the only .css information in the Archive page is
    @import "style.css";

    Is this what you suggest i should remove from the Archive page and should be in the style.css page? Isn't that where it came from in the first place? Sorry, I'm just trying to understand and get this right so I don't completely screw up my site...

14. britgirl
    Member
    Posted 5 years ago #

    Katgirl,

    I placed the code (at the bottom of my stylesheet and after the "postspermonth" class and it has done it - thank you!!
    I've one more question - and that is how to reduce the amount of space at the top of the page before "Archives by month. I suspect this is being controlled by another earlier class in the stylesheet? I will try an puzzle this out, but any suggestions welcome.

    Thanks again to you both.

15. KatGirl
    Member
    Posted 5 years ago #

    To control the amount of 'white space' before your header you'll need to adjust the margin here:

    .time_description {
    margin-top:80px;
    margin-left:20px;
    }

    Margin-top: 80px is telling the time_description tag to sit 80pixels from the nearest top margin, which in this case is the top of your page.

    Reducing this number 80px to say: 40px will reduce the 'space' by 40 pixels from your nearest margin. You can increase the #px to force more white space should you choose to do so. You can do this on any and all coding elements within your stylesheets. Padding, also does the trick in some cases, but padding only pads the element in question.

    Don't forget to back up your theme regularly. It will save tears in the future. :)

    I'm glad it worked for you. Good luck with your site.

16. britgirl
    Member
    Posted 5 years ago #

    Good advice. Thanks very much again :)

Topic Closed

This topic has been closed to new replies.