Is it possible to change slider width/height for posts and pages

Resolved ashtonej
(@ashtonej)

10 years, 4 months ago

I’d like to be able to change the slider width and height for posts and pages.

The template (which is very good) seems only to have one setting that applies to everything.

I have full width x 384px for the front page.

I’d like to be able to put container width x 225px (or there abouts) for pages and posts.

Can you guide me to either a code snippet fix or the part of the template I need to change to make this happen?

Thanks, Jim

Viewing 4 replies - 1 through 4 (of 4 total)

tomaja
(@tomaja)

10 years, 4 months ago
It is possible, you can use something like this for specific posts/pages e.g.
```
/* for specific post */
.postid-33 #customizr-slider.carousel .item {
height:         230px;
min-height:     230px;
line-height:    230px;
}
```
```
/* for specific page */
.page-id-12 #customizr-slider.carousel .item {
height:         230px;
min-height:     230px;
line-height:    230px;
}
```
To determine what is specific id for post or/and page use page source view option in your browser.
If you wish to use it on all posts and pages than just .page or .single should be enough
Thread Starter ashtonej
(@ashtonej)

10 years, 4 months ago

Hi tomaja. Thanks for the tip.

Based on your code, I ended up with the following which works great for my pages and posts.

Image size 980 x 225, centred with a small gap under the lower header border.

Jim

.page #customizr-slider {
top:10px;
width:980px;
height:225px;
margin-left:auto;
margin-right:auto;
}

.page #customizr-slider.carousel .item {
min-width:980px;
min-height:225px;
height:225px;
line-height:225px;
}

.single #customizr-slider {
top:10px;
width:980px;
height:225px;
margin-left:auto;
margin-right:auto;
}

.single #customizr-slider.carousel .item {
min-width:980px;
min-height:225px;
height:225px;
line-height:225px;
}

tomaja
(@tomaja)

10 years, 4 months ago

Nice to see that it works for you and thanks for the feedback.
chappie
(@chappie)

10 years, 4 months ago
I’m obviously making some errors when I try to adapt this code for my site – as can be seen by the acres of white space around my skinny slider:

http://s1008.photobucket.com/user/3785/media/public/shallow_slider.png.html

Here’s my/your code and my (full-height) slider looks exactly the same with or without it:
```
/* shallow slider for one page + posts */

.page-id-171 #customizr-slider {
 top:10px; 
width:1170px; 
height:181px; 
margin-left:auto; 
margin-right:auto; 
}
.page-id-171 #customizr-slider.carousel .item { 
min-width:1170px;
 min-height:181px;
 height:181px;
 line-height:181px;
 }
.single #customizr-slider { 
top:10px; 
width:1170px; 
height:181px; 
margin-left:auto;
 margin-right:auto;
 }
.single #customizr-slider.carousel .item { 
min-width:1170px
; min-height:181px;
 height:181px;
 line-height:181px; }
```
What did I do wrong?

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘Is it possible to change slider width/height for posts and pages’ is closed to new replies.