Adjusting album titles

  • Resolved vsolanic

    (@vsolanic)


    7 years, 6 months ago

    Hi,

    I would like to have album details displayed all the time. At the same time, however, I would like to have the album titles to be aligned to the thumbnails. With the current options I can choose “Slide up from bottom upon hover”, but this is not ideal for tablets and mobiles. I can also choose “Below the thumbnail”, but then the thumbnails are not aligned nicely. So I would like to either have the title always shown on as in the case of “Slide up from bottom upon hover” or to have them below the thumbnails but the aligned something like in the case of Google Photos albums.

    One more question – could you please refer me to an easiest way to change the size of the album titles (i.e. where should I put the css code)? I use a child theme.

    Here is the website: https://www.skmbrussels.be/photonic.

    Best regards,

    Vladimir

Viewing 12 replies - 1 through 12 (of 12 total)
  • Plugin Author Sayontan Sinha

    (@sayontan)

    Take a look at the suggestion here.

    Thread Starter vsolanic

    (@vsolanic)

    Hi,

    with some delay I tried your solution, but it does not seem to work well. All the titles are shown at the very bottom of the page. At times, the page does not seem to load the css placed in the child-theme style.css file.

    Any ideas how to move further?

    Thank you!

    vladimir

    Plugin Author Sayontan Sinha

    (@sayontan)

    I need to see an example of the error you are facing.

    Thread Starter vsolanic

    (@vsolanic)

    Hi,

    there seems to have been a problem. The site for some reason does not reflect the changes from the style.css file from the child theme. Any idea why this is the case?
    Should I put the custom CSS somewhere else?

    Nevertheless, I ‘implemented’ the proposed changes in Chrome. Please see the following screenshot of what the result would be. As you can see, album titles are piled at the very bottom of the gallery.

    Thanks for your guidance on how to fix this.

    Best regards,

    Vladimir

    Thread Starter vsolanic

    (@vsolanic)

    Hi,

    any solution for this issue? For some reason, the plugin does not seem to be picking up the CSS placed in the style.css file of the child theme. I find this strange as other changes that I placed there for the plug-in seem to work just fine. Help would be very much appreciated!

    Kind regards,

    Vladimir

    Thread Starter vsolanic

    (@vsolanic)

    OK. It seems that what is missing from proper functioning of the suggested code is the following CSS piece:

    .photonic-thumb{position:relative;}

    Nevertheless, I still do not know why the plugin is not picking this part of the CSS from my custom.css file. Thanks for any guidance on this issue.

    Plugin Author Sayontan Sinha

    (@sayontan)

    Instead of .photonic-tiled-photo .photonic-title-info and .photonic-tiled-photo .photonic-title, switch it to .photonic-thumb .photonic-title-info and .photonic-thumb .photonic-title

    Thread Starter vsolanic

    (@vsolanic)

    Hi,

    it seems to have worked. Many thanks! Could I ask for one more idea? I would like to display albums on the front page in a sidebar like this. I added the following CSS code in the custom.css file:

    .photonic-thumb .photonic-gallery-1c {
    width: 50%;
    padding-right:8px;	
}

    However, the plugin is somehow not reflecting this. And I cannot figure out which class exactly I should be addressing. Thanks a lot for your guidance!

    Best regards,

    Vladimir

    • This reply was modified 7 years, 5 months ago by vsolanic.
    Plugin Author Sayontan Sinha

    (@sayontan)

    What is the shortcode you are using for the sidebar? It looks like you are specifying the number of columns as 1 for your output, but what you want to display is a 2-column layout. So, why not use 2 for the number of columns?

    Thread Starter vsolanic

    (@vsolanic)

    Hi,

    this indeed is a part of the solution. Although the formatting is still not ideal. I would need to reduce the vertical space between two thumbnails and align the titles. Is there a way to refer specifically to those titles?

    Thanks again for all your help!

    Best regards,

    Vladimir

    Plugin Author Sayontan Sinha

    (@sayontan)

    To be honest, I am not sure why you want to get the layout effect that you are looking for – for the second thumbnail on your site the title is going to cover almost the entire image.

    Anyway, you have these settings for .photonic-thumb .photonic-title-info that are causing the broken layout: bottom: 13px and width: 91.5%. If you set bottom: 45px and remove the width setting, things will align.

    Thread Starter vsolanic

    (@vsolanic)

    Hi,

    thank you for bearing with me. Perhaps I should explain what I actually want. In fact I want two things:

    I was trying to have it nicely formatted. I thought that it would be easiest to have them formatted in the same way. Originally, I wanted to have the photo gallery page formatted as in Google Photos, but I was not able to align titles beneath the thumbnails. That’s why I started implemented a solution where the title is overlaid over the thumbnail and also using the ‘width’ property. And since I wanted to have the latest photo galleries shown also at the front page, I was trying to implement the same solution.

    In any case I will not bother you anymore, I think I will just increase ‘bottom’ – this will not be a perfect solution as on the front page there will be a pretty large vertical space between two thumbnails and on the photo gallery page the title will not be aligned at the bottom, but I think I will survive that :).

    Thanks a lot once again!

    Best regards,

    Vladimir

Viewing 12 replies - 1 through 12 (of 12 total)
  • The topic ‘Adjusting album titles’ is closed to new replies.