wordpress website displaing image and image path - wordpress

Recently I noticed in my Wordpress website that in all the pages, when I have an image to display, it displays the image and right after it displays the path to the image, including the image properties. The entire
Can someone helpe, please?
enter image description here

Seems like your HTML Structure breaks with your PHP Code. you need to check your code where you getting this Image. This is how its showing from Inspect Element:
<img src="http://antiparosbeauty.gr/wp-content/uploads/2014/03/weding.jpg" alt="weding" class="alignleft size-full wp-image-140" srcset="http://antiparosbeauty.gr/wp-content/uploads/2014/03/weding.jpg 345w, <a href=" http:="" antiparosbeauty.gr="" wp-content="" uploads="" 2014="" 03="" weding-300x141.jpg"="" target="_blank" height="163" width="345">

Related

Problems with adding pictures to gallery page

I have a gallery page that looks pretty good, but I need to add my own pictures of myself and/or family... I've tried to do so but it isn't working the way it should.
Here a codepen of the problem: https://codepen.io/AJ2021/pen/EOWYvmenter code here
I need my photos to be in a shadowbox so I have a thumbnail on the page and when I click on it, it opens in a large view.
If the codepen has the exact same code your dreamweaver does, I found an error in the snippet.
It originally was:
" alt=""/> rel="shadowbox[picture]" title="a">
<img src="../Documents/SU Fall 2017/Foltz class/tmb_Lawtons_Marina.jpg">
</a>
Now it's:
<a href="../Documents/SU Fall 2017/Foltz_class/img_Lawtons_Marina.jpg" alt="" rel="shadowbox[picture]" title="a">
<img src="../Documents/SU Fall 2017/Foltz class/tmb_Lawtons_Marina.jpg">
</a>
It looks like the anchor tag <a> had closed too early.

Wordpress Blur / Pixelated Images on first run

I have a wordpress website for a client.
The client reported a problem that the website home page shows blur images on first load. After a refresh or second run the images load fine.
url: slmp.com.pk
How to fix this issue?
Disable Adaptive images in the theme control panel.
On the first load the image is coming from this:
<img src="https://www.slmp.com.pk/wp-content/uploads/2016/12/Screenshot_16-uai-258x26.png" alt="logo" width="258" height="26" class="img-responsive adaptive-async adaptive-fetching" data-uniqueid="93-141064" data-guid="https://www.slmp.com.pk/wp-content/uploads/2016/12/Screenshot_16.png" data-path="2016/12/Screenshot_16.png" data-width="999" data-height="100" data-singlew="null" data-singleh="null" data-crop="" data-fixed="height">
and second load is coming from this
<img src="https://www.slmp.com.pk/wp-content/uploads/2016/12/Screenshot_16.png" alt="logo" width="999" height="100" class="img-responsive">
if you change the image src on the first load to https://www.slmp.com.pk/wp-content/uploads/2016/12/Screenshot_16.png it will load fine.
In the div with a class of background-wrapper there is another div with a background image.
Whatever calls that background image should be something like get_post_thumbnail( $post_id )
Add a second parameter of full to the call like this get_post_thumbnail( $post_id, 'full' ) to ensure that the full sized image is always pulled in.

Image Could not be loaded - Wordpress issue

I am having issue on my wordpress website. Where I have gallery plugin and the images in that gallery showing this error message when you click on the image. In past those used to pop up when you click on it. But currently it show this error message. I think there is some js conflict please help me here. screenshot- here
webpage - http://www.marvelrealtors.com/residential-properties/izara/
image url is missing in anchor tag. please check.
<a href="#" class="poppup">
<img src="http://www.marvelrealtors.com/wp-content/uploads/2015/05/Izara-Dining-Room.jpg" title="Dining" alt="Dining" data-lazy-loaded="true" style="display: inline;"><noscript><img title="Dining" src="http://www.marvelrealtors.com/wp-content/uploads/2015/05/Izara-Dining-Room.jpg" alt="Dining"/></noscript>
</a>
Working script:
<a class="image-popup-no-margins boxed_shadow" href="http://www.marvelrealtors.com/wp-content/uploads/2015/06/Izara-site-plan.jpg" target="_self">
<img src="http://www.marvelrealtors.com/wp-content/uploads/2015/06/Izara-site-plan.jpg" class=" vc_box_border_grey attachment-full" alt="layout" data-lazy-loaded="true" style="display: inline;"><noscript><img src="http://www.marvelrealtors.com/wp-content/uploads/2015/06/Izara-site-plan.jpg" class=" vc_box_border_grey attachment-full" alt="layout" /></noscript>
</a>
The problem comes from file names, no accent, space or special character and it will work.

html image path incorrect

I'm somewhat perplexed by this.
..
The page im working on is located in
www.gd-gaming.com/wordpress/
However, for the background image to show, instead of putting it in
www.gd-gaming.com/wordpress/images
I've had to put it in
www.gd-gaming.com/images
Now, When I visit an additional page from the one im working on, (www.gd-gaming.com/wordpress/breakout-canidates/)
That background image dissapears. I cant understand why, I use the same code on a vbulletin website and the background displays everywhere. If I firebug it, it tells me the image didnt load, meaning the path is incorrect. I'm not sure where to put it though.
For actual reference..
http://www.gd-gaming.com/wordpress
http://www.gd-gaming.com/wordpress/breakout-canidates/
Code: <div id="background">
<img class="background" src="images/bgmain.jpg">
</div>
use absolute:
<div id="background"> <img class="background" src="/images/bgmain.jpg"> </div>
instead of relative one

Tumblr photo post caption positioning

I was hoping somebody would be able to help with the following query...
I've setup a Tumblr blog on which I'm going to regularly post photo sets.
I'd like to write a brief description with each set. I can do this
within the caption field that sits below the image. The problem with
this is that when including multiple images within a post the description
will be lost at the bottom, below all the images.
I'd like the caption to be positioned at the top of the post, before
the images so that viewers can read the description first.
Here's a link to the blog, though empty for now I've inserted a test
post to show how the information is displayed. The black block
represents an image set,'Coming Soon' was entered in the caption field.
http://rg-e.tumblr.com/
Any thoughts/or guidance would be greatly appreciated.
Thanks.
Would need to see your theme's code to provide you with specifics, but you just need to move where the {block:Caption} is being rendered.
An example:
{block:Photoset}
{block:Caption}{Caption}{/block:Caption}
{Photoset-500}
{/block:Photoset}
This will put the photoset's caption above the photoset.
Just to expand upon graygimore's answer - changing the position of the {block:Caption} - Here's the exact code I modified from my custom tumblr theme. Worked a treat.
Thanks again.
{block:Photo}
<section class="caption group">
{block:Caption}
<div class="cont">{Caption}</div>
{/block:Caption}
{block:ContentSource}
<div class="cont content_source">
<a href="{SourceURL}">
{lang:Source}:
{block:SourceLogo}
<img src="{BlackLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
{/block:SourceLogo}
{block:NoSourceLogo}
{SourceTitle}
{/block:NoSourceLogo}
</a>
</div>
{/block:ContentSource}
</section>
<section class="top media" style="display:block;">
{LinkOpenTag}<img src="{PhotoURL-HighRes}"> {LinkCloseTag}{Question}
</section>
{/block:Photo}

Resources