Comment Bubble CSS Customization

• 

  vlogazul · Member · May 5, 2014 at 8:38 pm

  • Copy link
  • Add topic to favorites

  Hello I am currently using the forever theme and i want to know if there”s a snippet for the upcoming.

  Is there a snippet to make the main page slider be 100% width just like the menu bar?

  Is there a snippet to erase the gray comment bubble from the featured image posts on the main page and overall pages?

  On the main page at the bottom, there’s a post that has a comment. if you click on the post and check the comment, there will be a text just below the commnet that says “Un pensamiento en Pavone pidió continuidad en La Máquina” is there s anippet to erase that text? thanks

  The blog I need help with is: (visible only to logged in users)

• 

  thesacredpath · Member · May 6, 2014 at 3:19 am

  • Copy link

  Hi, give the following a try.

  #featured-content {
      margin-left: 0;
      margin-right: 0;
  }
  .featured-post {
      width: 100.7%;
      margin-left: -2px;
  }
  #featured-content img {
      width: 100%;
  }

• 

  thesacredpath · Member · May 6, 2014 at 3:24 am

  • Copy link

  For the comment bubble:

  .comments-link a:before {
      border-color: #FFFFFF;
  }
  .comments-link a {
      background: rgba(0, 0, 0, 0);
  }

  To get rid of the line of text above the comments, add this.

  #comments-title {
      display: none;
  }

• 

  vlogazul · Member · May 6, 2014 at 7:10 am

  • Copy link

  The slider and the comment text worked perfectly! I just have a question about the comment bubble. I tried the snippet you gave me for the comment bubble and it shows that the bubble is gone but the number inside and once you put the mouse in the particular bubble position a black bubble will appear. Is there any way or a snippet to erase that comment bubble completely?

• 

  thesacredpath · Member · May 7, 2014 at 9:42 pm

  • Copy link

  It sounds like you want to get rid of the bubble and the comment count. The following will do that.

  .comments-link {
      display: none;
  }

• 

  vlogazul · Member · May 8, 2014 at 12:18 am

  • Copy link

  This snippet worked perfectly! Thanks

  If you check on my main page and also on each category page, at the bottom left hand side there a text link that says “Noticias Anteriores –>” is the a snippet to make the text link be centered? But only on the particular first pages, cause after you go to the second page there will be the same text on the left hand side and on the right hand side there’s a link text that says ” <— Noticias Recientes” so I would only want the text centered only on the first pages / main page and the after pages to leave it the way it is.

• 

  thesacredpath · Member · May 8, 2014 at 5:17 am

  • Copy link

  You can use the following which specifically targets the main home page.

  .home #content nav .nav-previous {
      float: none;
      margin-left: auto;
      margin-right: auto;
      width: 35%;
  }

  The problem is this also shows on the first page of a category, archive and tag listing. Those would have to have individual rules written for each category, archive and tag page using the page specific body ID class.