Strange WordPress Issue

  • bboysupaman

    (@bboysupaman)


    10 years, 1 month ago

    I am having difficulty with a WordPress site that has already been pretty heavily customized. Suddenly, one of the pages simply stopped working!

    The issue is that when clicking a video link, a lightbox clone (prettyPhoto) is supposed to show the youtube video, but instead the popup message “Image cannot be loaded. Make sure the path is correct and image exist.” displays.

    Here is what I have learned so far on the issue through a lot of research and exploring the code:

    – The page is composed of individual posts and the images that the anchor tag is surrounding are generated using the video thumbnail of each post.

    – The posts themselves are merely a YouTube link “ex: http://www.youtube.com/watch?v=LdOKJ7cybi4” with a title and a video thumbnail.

    – The issue seems to be caused by the href attribute that WordPress generates. Using the above youtube link example, it supplies an href attribute like this (it actually puts the span tags and everything inside of the href attribute):

    <span class='embed-youtube' style='text-align:center; display: block;'><iframe class='youtube-player' type='text/html' width='640' height='390' src='http://www.youtube.com/embed/LdOKJ7cybi4?version=3&rel=1&fs=1&showsearch=0&showinfo=1&iv_load_policy=1&wmode=transparent' frameborder='0'></iframe></span>

    – When I remove the span tags and all contents and replace it with the content of the post (ex: http://www.youtube.com/watch?v=LdOKJ7cybi4), then it works! But, I can’t figure out how to make it use the YouTube link that was typed into the post, rather than generating these excessive and unneccesary span tags.

    Help please!

Viewing 9 replies - 1 through 9 (of 9 total)
  • Senff – a11n

    (@senff)

    10 years, 1 month ago

    Not sure what you mean by “it actually puts the span tags and everything inside of the href attribute“.

    Is it possible to give us a link to the site so we can see the problem in action?

    Thread Starter bboysupaman

    (@bboysupaman)

    10 years, 1 month ago

    Yes. Absolutely. Thanks for taking the time to read my post.
    http://nandinahome.com/design-tips/

    kmessinger

    (@kmessinger)

    10 years, 1 month ago

    Your code is correct. Here it is exactly as you show above http://test.savethecolors.com/116/

    Senff – a11n

    (@senff)

    10 years, 1 month ago

    OK, so on the site, this is the code that you end up with:

    <a href="
<span class='embed-youtube' style='text-align:center; display: block;'><iframe class='youtube-player' type='text/html' width='640' height='390' src='http://www.youtube.com/embed/LdOKJ7cybi4?version=3&rel=1&fs=1&showsearch=0&showinfo=1&iv_load_policy=1&wmode=transparent' frameborder='0'></iframe></span>
" rel="prettyPhoto" title="" style="display:block; height:125px; overflow:hidden; position:relative; top:40px; padding-top:20px;">

    That’s definitely invalid code. You can’t have HTML within an href. What you should end up with, is something like this:

    <a href="//www.youtube.com/watch?v=B0ky-VMi9fI" rel="prettyPhoto" style="display:block; height:125px; overflow:hidden; position:relative; top:40px; padding-top:20px;">
                            	<img src="http://nandinahome.com/wp-content/themes/nandina/images/play.png" class="play">
                            	<img src="http://nandinahome.com/wp-content/uploads/2014/02/nandina-real-life-ad-atlanta-150x150.jpg" class="large_thumb" style="position:relative; top:-45px;">
                            </a>

    Can you tell me what code you put in your actual post content?

    I believe you should use this type of formatting:

    <a href="//www.youtube.com/watch?v=B0ky-VMi9fI" rel="prettyPhoto" title=""><img src="http://nandinahome.com/wp-content/themes/nandina/images/play.png" class="play">
                            	<img src="http://nandinahome.com/wp-content/uploads/2014/02/nandina-real-life-ad-atlanta-150x150.jpg" class="large_thumb" style="position:relative; top:-45px;"></a>
    Thread Starter bboysupaman

    (@bboysupaman)

    10 years, 1 month ago

    The only thing in the actual post content is:

    http://www.youtube.com/watch?v=LdOKJ7cybi4

    I know that the code with the reference url is invalid, I just don’t know why WordPress is converting my url to a sting of other elements (the invalid code).

    Thread Starter bboysupaman

    (@bboysupaman)

    10 years, 1 month ago

    Additionally (if this helps), the page on which the issue is occurring (http://nandinahome.com/design-tips) is a Custom Post Type generated from the Theme Functions using the following code:

    /* Videos */
	register_post_type( 'design_tips',
		array(
			'labels' => array(
				'name' => __( 'Design Tips' ),
				'singular_name' => __( 'Design Tip' )
			),
		'public' => true,
		'has_archive' => true,
		'menu_position' => 5
		)
	);

    This code then somehow sources the thumbnails and reference links from the posts that are posted in the Custom Post Type.

    kmessinger

    (@kmessinger)

    10 years, 1 month ago

    You do not need an href. Please read
    https://codex.wordpress.org/Embeds

    This is valid WordPress code.
    <p><iframe width=”640″ height=”480″ src=”http://www.youtube.com/embed/dQw4w9WgXcQ?feature=oembed&#8221; frameborder=”0″ allowfullscreen></iframe></p>

    WordPress adds nothing to your embed but the iframe.

    Can you replicate this with no plugins and the default theme?

    Thread Starter bboysupaman

    (@bboysupaman)

    10 years, 1 month ago

    Disabling all plugins seems to have eliminated the excess markup in the reference url. So, I guess I’m going to have to go through one plugin at a time and figure out which one is breaking it.

    kmessinger

    (@kmessinger)

    10 years, 1 month ago

    Yep, that is part of the basic debug. Sometimes you add them all back and it works!

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘Strange WordPress Issue’ is closed to new replies.

Tags