Image Feature CSS Customization

vlogazul · Member · Jun 20, 2016 at 1:05 am
Copy link

Add topic to favorites
Hello, I am using the Triton Lite theme and I would like to know if there’s a snippet for the following. Would there be a snippet to add a glowing feature when you click on the image of the images in the widget middle section of the main page. Pretty much the image that says “goal” and the other that has the soundcloud logo. Thanks

The blog I need help with is: (visible only to logged in users)
thesacredpath · Member · Jun 20, 2016 at 5:36 am
Copy link
Not exactly sure what you mean by “glowing”. Do you want the entire image to shift color, or are you talking about a border of some sort?
vlogazul · Member · Jun 20, 2016 at 6:05 am
Copy link
Yes. The entire image to shift color, so when you click on it it glows or does a feature similar to the images in the featured posts.
vlogazul · Member · Jun 20, 2016 at 7:37 am
Copy link
I meant a hover on the image. I have an old snippet I found from previous requests and I think it worked.
thesacredpath · Member · Jun 20, 2016 at 9:10 am
Copy link
It looks like it’s working from my end. Let us know if you need further assistance.
vlogazul · Member · Jun 23, 2016 at 4:19 am
Copy link
If you take a look at the main page slider, it has two posts. Would there be a snippet to make that slider rotate from one post to the other automatically?
thesacredpath · Member · Jun 23, 2016 at 4:49 am
Copy link
That is not something we can change with CSS. The parameters for the slideshow are in a javascript file, and we cannot edit that file, and we cannot add javascript here at WordPress.com for security reasons.
vlogazul · Member · Jun 24, 2016 at 6:20 am
Copy link
Sounds good, thanks for your explanation. Is there a snippet for the following. In the featured images you see that there’s a space or padding in between the image and the blue title. Is there a snippet to make the image and the tittle be adjacent to each other?
thesacredpath · Member · Jun 24, 2016 at 6:51 pm
Copy link
This should do it for you.
```
.blog .postitle, .archive .postitle {
margin-top: 0;
}
```
vlogazul · Member · Jun 26, 2016 at 8:46 pm
Copy link
It perfectly works, thanks. Is there a snippet for the following. If you click on any of my articles, you will see a poll on the right side in the widget section.

Would there be a snippet to decrease the width of that poll so it can fully fit into the widget section so it can align with the gray line from the top? since it seems that from the right side is not complete because of the current width, and also a snippet to get rid of the border radius.

thesacredpath · Member · Jun 28, 2016 at 4:16 am

Hi, see what you think with this.

#PDS_Poll {
    overflow: hidden;
}
#PDI_container9455646 .pds-box {
    border-radius: 0 !important;
    border: none !important;
}

vlogazul · Member · Jun 28, 2016 at 6:02 am
Copy link
It works great, thanks. If you look at the image widget below that poll you will see that the image on that particular widget is not adjacent with the tittle as it is with the other 2 widgets from the top. Is there a snippet to fix that?
thesacredpath · Member · Jun 28, 2016 at 10:00 pm
Copy link
Image widgets have a top margin on the image within them. Add the following to make that top margin 0.
```
.widget_image img {
    margin-top: 0;
}
```
vlogazul · Member · Jul 2, 2016 at 2:17 am
Copy link
It works amazing. Is there a snippet for the following. Is there a snippet to make the tittle of the slider in the main page be the same width as the image. Pretty much to look like the featured posts tittle, to start adjacent to the gray border from the bottom.
siobhyb · Member · Jul 4, 2016 at 5:01 pm
Copy link
Hi there. :)

You could increase the width of the title on the slider with the following snippet:
```
.featured .hentry, .featured .entry-title {
    width: 100%;
    max-width: 100%;
}
```
If you’d also like to fix the title to the bottom of the image then the following would work:
```
.featured .entry-title {
    margin-bottom: 0;
}

.featured .hentry {
    bottom: 0;
}
```
Let me know if that helps out! You know where to find us if any extra questions come up, too.
vlogazul · Member · Jul 4, 2016 at 7:03 pm
Copy link
It works great, thanks. would there be a snippet to hide the navigated page section of the posts but only from the main page and for it to stay on category pages?
siobhyb · Member · Jul 5, 2016 at 9:09 am
Copy link
Are you referring to the pagination at the very bottom of the home page? If so, it can be hidden with the following:
```
.home .nav-paginated {
    display: none;
}
```
If you’re referring to something else, let me know and I’ll see how I can help.

The topic ‘Image Feature CSS Customization’ is closed to new replies.

WordPress.com forums

Image Feature CSS Customization