Docs

[moabullon]

Hi,
Concerning my posts and when I publish for my blog portion

it is about 20 pics in the post and I would like them to be spaced and have bulleted numbers next to them 1 – 30 but when I hit the publish button the post only shows all the pics mashed together with no bullets or spacing.
What can I do to fix this.

url = thetogas.com

click on any post and you will see that they are all smashed together going down the page.
I would like them to be spaced with bullets next to them. numbering each pic as 1 – 20, ect

As I edit the post it shows up correctly but then as soon as I click publish and then look at the post it does not show up correctly

trying to accomplish something like

1. Pic

2. pic

3. pic

Not like

pic
pic
pic
pic

[Rupok]

Hi there,

Thanks for writing in! It seems you are using older version of X and Cornerstone. Can you confirm that you are fully updated? (Theme and Plugins)

You can find the latest version numbers here: (http://theme.co/changelog/) Then you can compare them to what’s installed on your site.

If you find anything to be out of date, you can review our update guide.

After updating, clear your browser’s cache and check again. If you still find any issue, kindly attach some screenshot and your login credentials in a private reply.

Cheers!

[moabullon]

This reply has been marked as private.

[Darshana]

Hi there,

I’m sorry but your reference images not updated properly due to our file-size limit of 512KB. Please use an online tool to share it (http://snag.gy/), so that we can check your issue and assist you accordingly.

Thanks!

[moabullon]

my posts currently look like pic 3 but I would like them to look more like pic 2

[moabullon]

This is what my site looks like: But i don’t like how the post is being made:
http://thetogas.com/?p=665

This is what I want my posts to look like:
http://thechive.com/2016/05/30/bikinis-go-hand-in-hand-with-mdw-50-photos/

[Lely]

Hi There,

Thank you for the URL. Please add the following CSS on Appearance > Customize > Custom > Edit Global CSS:

.single-post li.gallery-icon::before {
    content: counter(section);
    position: absolute;
    left: -20px;
    background: red;
    width: 20px;
    height: 21px;
    top: 0px;
    color: #ffffff;
    font-size: 15px;
    padding: 2px 0 0 0;
    line-height: 1.1;
}
.single-post li.gallery-icon {
    margin-bottom: 10px;
    position: relative;
    counter-increment: section;
}

Feel free to adjust values like font color and background color.

Hope this helps.

[moabullon]

Hi,
unfortunately this is not having the desired effect I am looking for.

I am looking to have a similar outfit in the sense of how the pics are being shown when you click on the post.

When you click on the post from the main page, I would like the pics displayed in a format like this

1. Pic

2. pic

3. pic

Not like

pic
pic
pic
pic

I put it all in the desired format when I am editing the post but after I publish and then click to view the post, the format switches to all the pics smashed together with no spacing or bullets such as

pic
pic
pic
pic

[Lely]

Hello There,

I can see the number on the left side of the image when I check this link:http://thetogas.com/?p=665.

Regarding the spacing between theimages, please adjust 10px on the following CSS to your preferred spacing:

.single-post li.gallery-icon {
    margin-bottom: 10px; /*Increase this for more space between images*/
    position: relative;
    counter-increment: section;
}

Are you seeing different from the screenshot or you’re expecting different result? Please clarify to help you better.

[moabullon]

Oh wow no that looks great! sorry I missed it. Thanks

Although it is only for one post. Is there a way to do it for all posts?

Additionally is there a way to get a format plugin that will do this type of format? or a simpler format? or do I have to have it coded in the CSS?

[Joao]

Hi There,

Please add the code above given at Appereance / Customizer / Custom / CSS and it will affect every single post of your website.

You need to add just ont time to Appereance / Customizer / Custom / CSS

Hope that helps,

Joao

[moabullon]

I’m sorry but I don’t think it is working for any other post. It only shows up on the one post and I beleive that I put the coding in the correct custom css.

I tried reupdating a couple posts in case it just need to be refreshed afterward.

additionally, when this is all said and done, will everything I put in my blogs whether it is pic or not show up with a number? or will it only apply when I have pics in the post? Does that make sense?

thanks

[Jade]

Hi there,

Please try to update the code to this:

.single-post li.gallery-icon {
    margin-bottom: 10px !important; /*Increase this for more space between images*/
    position: relative !important;
    counter-increment: section !important;
}

Hope this helps.

[moabullon]

I updated the code but unfortunately no other posts are changing. It seems to only be applying to one post, and not all the others. Please take a look at my css to make sure it is correct. I don’t know why it is not working.

[Rue Nel]

Hello There,

Please check your custom css. There seems to be an invalid entry. Please see the screenshot below;

And when viewing your individual post, I can see that the css is working.
http://prntscr.com/bbr3qy
http://prntscr.com/bbr3xb

And on this page, http://thetogas.com/?p=655 it is not woking because it is not a gallery shortcode unlike the previous page. Please make sure that you have inserted a gallery shortcode because the css will only apply to that element.

Hope this make sense. Please let us know how it goes.

[Author]

Posts