Question: How to turn off captions of images (singlepic)

Resolved PrinceOfPersia
(@princeofpersia)

7 years, 12 months ago

I am using the latest Avada 4.0.3 on the latest WordPress 4.6.1 version. I am using the NextGen plugin to organize my pictures.

I use next shortcodes to add a picture into my blog posts:

[separator style_type=”none” top_margin=”8″]
[imageframe style=”dropshadow” bordercolor=”white” bordersize=”8px” stylecolor=”gray” align=””] [singlepic id=98 w=400 h=300] [/imageframe]
[separator style_type=”none” top_margin=”8″]

However with Safari, Firefox and the Edge browser my images are shown with a caption. With Internet Explorer the captions are not shown. How can I turn off captions for every browser? Is there any shortcode or CSS code which prevents this?

For an example open a blog topic with pictures on my blog with one of the above browser (http://www.matthijsseninfo.nl)

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

Plugin Contributor photocrati
(@photocrati)

7 years, 11 months ago

@princeofpersia – I suspect you are using the NextGEN Legacy SinglePic template with the SinglePic display, try using the default (read: blank) template and you should not see the image caption.

Check under Gallery > Gallery Settings > NextGEN Basic SinglePic

Thanks!

– Cais.
Thread Starter PrinceOfPersia
(@princeofpersia)

7 years, 11 months ago
@cais – Thank you for your answer. Much appreciated. I already looked into that and when I switch from NextGEN Legacy SinglePic.php template to default (I only have these two choices), I will get a blank caption which is also not correct. Especially with my Avada Theme ‘decoration’ around the image this does not look very nice:

[imageframe style=”dropshadow” bordercolor=”white” bordersize=”8px” stylecolor=”gray” align=””] [singlepic id=98 w=400 h=300] [/imageframe]

Interesting enough with Windows Explorer 10 it looks OK, but not with other browsers (e.g. Firefox, Safari).

This means that this issue is not Resolved, thus can you please remove that from the thread.

You will immediately notice it when you watch an image on my blog (http://www.matthijsseninfo.nl). I hope you understand what I mean otherwise I’ll try to explain it better.

I run WordPress under my Debian Server at home:

WP 4.6.1 with Avada 4.0.3 theme
Apache/2.4.10 (Debian) PHP/5.6.24-0+deb8u1 mod_python/3.3.1 Python/2.7.9 OpenSSL/1.0.1t mod_perl/2.0.9dev Perl/v5.20.2
PHP Version 5.6.24-0+deb8u1
MySQL 5.5.52
GD Library 2.1.1-dev
- This reply was modified 7 years, 11 months ago by PrinceOfPersia.
Plugin Contributor photocrati
(@photocrati)

7 years, 11 months ago

@princeofpersia – If you use the SinglePic shortcode outside of the Avada(?) shortcode, do you still have the same issue (when no template is in use)? As it is, the default SinglePic display does not render the image description so there is likely some other conflict happening to cause the issue you are seeing.

Thanks!

– Cais.

Thread Starter PrinceOfPersia
(@princeofpersia)

7 years, 11 months ago

@cais – It is not easy to check if empty caption is shown after the image when I move the NextGen shortcode outside the Avada decoration (as it is blank).

In my code I have next shortcodes:

[singlepic id=3355 w=400 h=300]
[imageframe style=”dropshadow” bordercolor=”white” bordersize=”8px” stylecolor=”gray” align=””] [singlepic id=3355 w=400 h=300] [/imageframe]

This delivers next

When checking source-code of the rendered web-page I see:

<div class=”ngg-gallery-singlepic-image ” style=”max-width: 225px”>
<a href=”http://eye-vision.homeip.net/wp-content/gallery/florida-2016/00-Versiering-voor-verjaardag-Diana.JPG”
title=”Versiering voor verjaardag Diana”
data-src=”http://eye-vision.homeip.net/wp-content/gallery/florida-2016/00-Versiering-voor-verjaardag-Diana.JPG”
data-thumbnail=”http://eye-vision.homeip.net/wp-content/gallery/florida-2016/thumbs/thumbs_00-Versiering-voor-verjaardag-Diana.JPG”
data-image-id=”3355″
data-title=”Versiering voor verjaardag Diana”
data-description=”Versiering voor verjaardag Diana”
target=’_self’
>
<img class=”ngg-singlepic”
src=”http://eye-vision.homeip.net/wp-content/gallery/florida-2016/dynamic/00-Versiering-voor-verjaardag-Diana.JPG-nggid043355-ngg0dyn-400x300x100-00f0w010c010r110f110r010t010.JPG”
alt=”Versiering voor verjaardag Diana”
title=”Versiering voor verjaardag Diana”
width=”225″
/>

</div>
<span></span>
<br />

<span style=”border:8px solid white;-moz-box-shadow: 2px 3px 7px rgba(0,10,0,.3);-webkit-box-shadow: 2px 3px 7px rgba(0,10,0,.3);box-shadow: 2px 3px 7px rgba(0,10,0,.3);” class=”fusion-imageframe imageframe-dropshadow imageframe-1 hover-type-none”>
<div class=”ngg-gallery-singlepic-image ” style=”max-width: 225px”>
<a href=”http://eye-vision.homeip.net/wp-content/gallery/florida-2016/00-Versiering-voor-verjaardag-Diana.JPG”
title=”Versiering voor verjaardag Diana”
data-src=”http://eye-vision.homeip.net/wp-content/gallery/florida-2016/00-Versiering-voor-verjaardag-Diana.JPG”
data-thumbnail=”http://eye-vision.homeip.net/wp-content/gallery/florida-2016/thumbs/thumbs_00-Versiering-voor-verjaardag-Diana.JPG”
data-image-id=”3355″
data-title=”Versiering voor verjaardag Diana”
data-description=”Versiering voor verjaardag Diana”
target=’_self’
>
<img class=”ngg-singlepic”
src=”http://eye-vision.homeip.net/wp-content/gallery/florida-2016/dynamic/00-Versiering-voor-verjaardag-Diana.JPG-nggid043355-ngg0dyn-400x300x100-00f0w010c010r110f110r010t010.JPG”
alt=”Versiering voor verjaardag Diana”
title=”Versiering voor verjaardag Diana”
width=”225″
/>

</div>
<span></span></span>
<div class=”fusion-sep-clear”></div><div class=”fusion-separator fusion-full-width-sep sep-none” style=”border-color:#3e3e3e;margin-left: auto;margin-right: auto;margin-top:8px;”></div>

Plugin Contributor photocrati
(@photocrati)

7 years, 11 months ago

@princeofpersia – That would definitely point to the Avada shortcode creating the issue you are seeing. Have you contacted its authors to see if they can provide assistance for their shortcode?

Thanks!

– Cais.

Thread Starter PrinceOfPersia
(@princeofpersia)

7 years, 11 months ago

@cais – Thank you for checking. I will now contact the Avada team. I first needed to assure that the issue was not with NextGEN.

Plugin Contributor photocrati
(@photocrati)

7 years, 11 months ago

@princeofpersia – No worries. Unfortunately with Avada’s complexity it can cause unexpected issues in some cases, such as what you are seeing on your site.

– Cais.

Thread Starter PrinceOfPersia
(@princeofpersia)

7 years, 11 months ago

@cais – This is the reaction I got from Avada:

This is actually coming from the NextGen gallery plugin and not Avada. However, you can remove that black bar/spacing at the bottom of the images with the below CSS:

.ngg-gallery-singlepic-image {
margin-bottom: 0px !important;
}

That will give you > http://prntscr.com/cnkq3i

The custom CSS option is located in Theme Options > Custom CSS;

For now I have solved it with this CCS code. However perhaps good that you check this at your end as well?

Plugin Contributor photocrati
(@photocrati)

7 years, 11 months ago

@princeofpersia – Thanks for sharing this work-around that is required when using SinglePic with the Avada theme. As you examples showed, the SinglePic display worked fine until you wrapped it in a shortcode provided by the theme.

– Cais.

Thread Starter PrinceOfPersia
(@princeofpersia)

7 years, 11 months ago

@cais – Looking to the workaround I am still not sure if the issue is because of Nextgen or Avada. I mean the first picture in the example does not show the issue (not wrapped in Avada shortcode), but keep in mind that this bottom margin it also not noticeable in that case as it is blending in with the background.

Plugin Contributor photocrati
(@photocrati)

7 years, 11 months ago

@princeofpersia – The Avada shortcode is creating the environment where the NextGEN Gallery display is not working as you expect. This is why I see it as related to the theme versus the SinglePic display. Although it requires NextGEN Gallery specific CSS to address that does not mean it is specifically NextGEN Gallery creating the problem, it is common for themes to add “compatibility” code for specific plugins which may be simply adjusting specific styles under specific conditions.

Thanks!

– Cais.

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

The topic ‘Question: How to turn off captions of images (singlepic)’ is closed to new replies.