WordPress.org

Ready to get started?Download WordPress

Forums

Collapsing Categories
changing the font size on this plug in (12 posts)

  1. miltonadmin
    Member
    Posted 1 year ago #

    its prob so easy but i just don't know how to do it, can someone please help, i would like to make the font on this widget bigger.

    http://wordpress.org/extend/plugins/collapsing-categories/

  2. miltonadmin
    Member
    Posted 1 year ago #

    I tried putting these in my CSS but none seem to change the font.

    .widget_collapscat li a {
    font-size: 1.6em;

    }
    collapsCatList li a {
    font-size: 1.6em;
    }

    .collapsCatList li a {
    font-size: 1.6em;
    }

    .widget_collapsCat li a {
    font-size: 1.6em;

    }

    .widget_collapsCatList li a {
    font-size: 1.6em;

    Please help.

  3. manfer
    Member
    Posted 1 year ago #

    .widget_collapscat ul li {
      font-size: 1.2em;
    }
  4. miltonadmin
    Member
    Posted 1 year ago #

    Hi, I tried this, it did not work...

  5. manfer
    Member
    Posted 1 year ago #

    If you provide a link then would be possible to know why that css doesn't work for you.

  6. miltonadmin
    Member
    Posted 1 year ago #

  7. manfer
    Member
    Posted 1 year ago #

    All CSS rules that you insert below

    /*--[ PRINT STYLES ]--------------------------------------------------------------------------------*/
    @media print {

    are targeting the printed version of your website. All those CSS rules doesn't apply to the on screen version you are seeing on your browser.

    Move any rule that you intend to be applied to the on screen version above those lines. Or close the @media print { where the rules for the print version finish.

    If you choose to move the rules above anyway close the @media print { because right now that rule is not closed.

  8. miltonadmin
    Member
    Posted 1 year ago #

    I closed it, or at least I thought I did. It still hasn't changed. I must be retarded.

  9. manfer
    Member
    Posted 1 year ago #

    This is now what you have at the end of your indigo.css file:

    /*--[ PRINT STYLES ]--------------------------------------------------------------------------------*/
    @media print {
      {
        background: transparent !important;
        color: #444 !important;
        text-shadow: none;
    	}
      a, a:visited {
        color: #444 !important;
        text-decoration: underline;
      }
      a:after {
        content: " (" attr(href) ")";
      }
      abbr:after {
        content: " (" attr(title) ")";
      }
      .ir a:after {
        content: "";
      }
      /* Don't show links for images */
      pre, blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
      }
      img {
        page-break-inside: avoid;
      }
      @page  {
        margin: 0.5cm;
      }
      p, h2, h3 {
        orphans: 3;
        widows: 3;
      }
      h2, h3 {
        page-break-after: avoid;
      }
    
    .widget_collapscat li a {
        font-size: 2.6em;
    }
    .widget_collapscat ul li {
     font-size: 2.6em;
    
    }}

    All of that is only for printing. If you want the rules for collapsing categories to be applied on the on screen version you see on your browser, that part of code should be:

    .widget_collapscat li a {
        font-size: 2.6em;
    }
    .widget_collapscat ul li {
     font-size: 2.6em;
    }
    /*--[ PRINT STYLES ]--------------------------------------------------------------------------------*/
    @media print {
      {
        background: transparent !important;
        color: #444 !important;
        text-shadow: none;
    	}
      a, a:visited {
        color: #444 !important;
        text-decoration: underline;
      }
      a:after {
        content: " (" attr(href) ")";
      }
      abbr:after {
        content: " (" attr(title) ")";
      }
      .ir a:after {
        content: "";
      }
      /* Don't show links for images */
      pre, blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
      }
      img {
        page-break-inside: avoid;
      }
      @page  {
        margin: 0.5cm;
      }
      p, h2, h3 {
        orphans: 3;
        widows: 3;
      }
      h2, h3 {
        page-break-after: avoid;
      }
    } /* End of Print Styles */

    With the collapsing categories rules above. Or:

    /*--[ PRINT STYLES ]--------------------------------------------------------------------------------*/
    @media print {
      {
        background: transparent !important;
        color: #444 !important;
        text-shadow: none;
    	}
      a, a:visited {
        color: #444 !important;
        text-decoration: underline;
      }
      a:after {
        content: " (" attr(href) ")";
      }
      abbr:after {
        content: " (" attr(title) ")";
      }
      .ir a:after {
        content: "";
      }
      /* Don't show links for images */
      pre, blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
      }
      img {
        page-break-inside: avoid;
      }
      @page  {
        margin: 0.5cm;
      }
      p, h2, h3 {
        orphans: 3;
        widows: 3;
      }
      h2, h3 {
        page-break-after: avoid;
      }
    } /* End of Print Styles */
    
    .widget_collapscat li a {
        font-size: 2.6em;
    }
    .widget_collapscat ul li {
     font-size: 2.6em;
    }

    Closing print styles before the collapsing categories rules.

    Hope it helps now.

    Regards.

  10. miltonadmin
    Member
    Posted 1 year ago #

    thank you for being so patience with me! thanks again!!!

  11. karenelated
    Member
    Posted 1 year ago #

    I want to make the post font size 12, without changing the category fonts. I am editing the kubrick style in the category widget collapsing-categories/collapsCatStyles.php which has the following code:

    $defaultStyles= array(
    'kubrick' => "{ID} span.collapsing.categories {
    border:0;
    padding:0;
    margin:0;
    cursor:pointer;
    }

    {ID} li.widget_collapscat h2 span.sym {float:right;padding:0 .5em}
    {ID} li.collapsing.categories.self a {font-weight:bold}
    {ID}:before {content:'';}
    {ID} li.collapsing.categories:before {content:'';}
    {ID} li.collapsing.categories {list-style-type:none}
    {ID} li.collapsing.categories{
    padding:0 0 0 1em;
    text-indent:-1em;
    }
    {ID} li.collapsing.categories.item:before {content: '\0BB \0A0' !important;}
    {ID} li.collapsing.categories .sym {
    cursor:pointer;
    font-size:1.1em;
    font-family:Arial, Helvetica;
    padding-right:5px;}",

    I removed the bold, but when adding the font-size, the only place it makes a difference is here and then it changes the whole widget font size:

    {ID} li.collapsing.categories {list-style-type:none;font-size:12px}

    Please help? Thanks!

  12. karenelated
    Member
    Posted 1 year ago #

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic

Tags

No tags yet.