WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] How do I change the color of my Comment Link (14 posts)

  1. drewdroid
    Member
    Posted 2 years ago #

    My friend helped me use artisteer to generate the theme for my site.

    On my site, http://viewofthedrew.com/, I don't know how to change *just* the color of the comment link at the end of my posts (where it says "Please leave a comment, 1 Comment, or # Comments")

    I've done some code detective work [I'm very very new at this] and I learnt how to change the CSS styles of that entire area but I want the Comment link to be another color to stand out.

    The text itself I found is controlled by the comments_popup_link portion in my functions.php file. The styling of that whole area is controlled by an area in my stylesheet.css called /* begin PostIcons, PostFooterIcons */.

    Also is there any way to force that text to be all on the same line? Do I use one of those   things?

  2. Rodni
    Member
    Posted 2 years ago #

    You can't make the text be all on the same line, because it could break the structure of the site or, most probably, overlap the sidebar. But you can reduce the text size if you really want it to occupy just one line.

    Going back to your first question, there's a little problem with changing the color just on the comments' link. There's no CSS class assigned to that little piece of code, but we can add it if you want :) Just add here that part of the code in your functions.php file you mentioned, and we'll edit it together :)

  3. money-maker
    Member
    Posted 2 years ago #

    In order to change the color you will need to add a div class tag around the comments. You'll have to look in your template to correct this. Also, as Rodni said, the "leave a comment" already is on the same line but is being broken because of lack of space, if you reduce the font size size you'll see it on one line (though you'll have to keep tag count down).

  4. drewdroid
    Member
    Posted 2 years ago #

    Thanks so much. What I meant was that I wanted just the text "please leave a comment", to not break up which I think I accomplished using non-breaking spaces. Or at least it seems to work, because now if there is not enough space it'll go to the next line.

    So forget that, let's see if I can get this color thing to work.

    Here is the functions.php file code:

    case 'comments':
                if(is_page() || is_single()) break;
                    ob_start();
                    comments_popup_link(__('Please leave a comment »', THEME_NS), __('1 Comment »', THEME_NS), __('% Comments »', THEME_NS), '', __('Comments Closed', THEME_NS) );
                    $result[] = art_get_post_icon($icon) . ob_get_clean();

    And here is the Postfootericon code in my stylesheet.css

    /* begin PostIcons, PostFooterIcons */
    .art-postfootericons
    {
      color: white;
      padding: 5px;
      border-bottom-style:ridge;
      border-width:3px;
    border-color: #262626;
    }
    
    .art-postfootericons, .art-postfootericons a, .art-postfootericons a:link, .art-postfootericons a:visited, .art-postfootericons a:hover
    {
      font-size: 13px;
      text-decoration: none;
      font-weight: bold;
      margin: 5px;
    }
    
    .art-postfootericons a, .art-postfootericons a:link, .art-postfootericons a:visited, .art-postfootericons a:hover
    {
      margin: 0px;
      text-decoration: underline;
      color: #607F5D;
    }
    
    .art-postfootericons a:visited, .art-postfootericons a.visited
    {
    
      color: #607F5D;
    }
    
    .art-postfootericons a:hover, .art-postfootericons a.hover
    {
    
      text-decoration: none;
      color: #B6F1B0;
    }
    /* end PostIcons, PostFooterIcons */
  5. Rodni
    Member
    Posted 2 years ago #

    For what I can see, we can work directly on the functions.php file. But if you want to do a better organized modification, I'll be needing your loop.php file code, as well as your loop-page.php file code just in case.

    Waiting for your reply so we resolve this :)

  6. drewdroid
    Member
    Posted 2 years ago #

    It seems like my theme has no file named loop.php, or loop-page.php..... is that even possible?

  7. Rodni
    Member
    Posted 2 years ago #

    OMG! That's really weird :S But if your site is working, then I guess it's possible :P Can you name for me the list of files based on your theme folder?

  8. drewdroid
    Member
    Posted 2 years ago #

    Templates
    404 Template
    (404.php)
    Archives
    (archive.php)
    Comments
    (comments.php)
    Footer
    (footer.php)
    Header
    (header.php)
    Main Index Template
    (index.php)
    One Column Page Template
    (onecolumn-page.php)
    Page Template
    (page.php)
    Search Form
    (searchform.php)
    Search Results
    (search.php)
    Single Post
    (single.php)
    Theme Functions
    (functions.php)
    block.php
    (block.php)
    block_header.php
    (block_header.php)
    comment.php
    (comment.php)
    legacy-comments.php
    (legacy-comments.php)
    navigation.php
    (navigation.php)
    onecolumn-page.php
    (onecolumn-page.php)
    pagination.php
    (pagination.php)
    parser.php
    (parser.php)
    post.php
    (post.php)
    post_metadatafooter.php
    (post_metadatafooter.php)
    post_metadataheader.php
    (post_metadataheader.php)
    post_title.php
    (post_title.php)
    sidebars.php
    (sidebars.php)
    vmenu.php
    (vmenu.php)
    vmenu_header.php
    (vmenu_header.php)
    widgets.php
    (widgets.php)

    Styles
    Stylesheet
    (style.css)
    style.ie6.css
    (style.ie6.css)
    style.ie7.css
    (style.ie7.css)

  9. Rodni
    Member
    Posted 2 years ago #

    I'm guessing the one file we have to edit is post.php. I'd be really greatful if you could show me the code in that file...

  10. jrav001
    Member
    Posted 2 years ago #

    case 'comments':
    if(is_page() || is_single()) break;
    ob_start();
    comments_popup_link(__('<div class="new-color">Please&nbsp;leave&nbsp;a&nbsp;comment&nbsp;»</div>', THEME_NS), __('1 Comment »', THEME_NS), __('% Comments »', THEME_NS), '', __('Comments Closed', THEME_NS) );
    $result[] = art_get_post_icon($icon) . ob_get_clean();

    In your stylesheet
    .new-color a {color: #fff;}

  11. Rodni
    Member
    Posted 2 years ago #

    That's the easy way I was talking about. You can solve your problem with jrav001's solution, but I'll prepare the one I talked you about, and then you can choose which way to go :)

  12. Rodni
    Member
    Posted 2 years ago #

    I installed Artisteer and checked out the structure of the information in the files that program generates, and couldn't find what I was looking for. Artisteer has a very different structure.

    So I guess that leaves us with the other solution. But jrav001's solution was incomplete and a little wrong, so here you have the one that will completely work for what you want to do. First repleace that piece of code you attached before in your functions.php file for this:

    case 'comments':
                if(is_page() || is_single()) break;
                    ob_start();
                    comments_popup_link(__('<span class="comments-link">Please leave a comment »</span>', THEME_NS), __('<span class="comments-link">1 Comment »</span>', THEME_NS), __('<span class="comments-link">% Comments »</span>', THEME_NS), '', __('<span class="comments-link">Comments Closed</span>', THEME_NS) );
                    $result[] = art_get_post_icon($icon) . ob_get_clean();

    And then you need to add this in your style.css:

    .comments-link {
    	color: #900;
    }
    a .comments-link:hover {
    	color: #F00;
    }

    You should change the colors to the ones you want to use. The first one is for the color of the comments' link, and the second one is for when you put your mouse over the link.

    And that's all! It should work like a charm :D Good luck drewdroid!

  13. drewdroid
    Member
    Posted 2 years ago #

    Thanks Rodni, that worked 100%. Now my comment link stands out.

  14. Rodni
    Member
    Posted 2 years ago #

    I'm really glad to hear that drewdroid! :D Really happy to help you! Hope to see around here again ;P

Topic Closed

This topic has been closed to new replies.

About this Topic