html in attachment description breaks mla_gallery shortcode

Thanks for your question and for taking the time to post your source code and the link to an image showing the results. I have a few questions about the information you have provided.

1. The “(rather long) description” contains a damaged URL value for the href attribute. Is this the actual value or has it been corrupted at some point? The value in your “how it looks” image does not have the problem.
2. Can you provide the source for the “vws” markup template. It would be helpful to see the tags, values and substitution variables in the template.
3. Can you explain the size="vws" parameter? is this an intermediate size you have registered with WordPress?
4. From your “how it looks” image it appears that you are using your Description field in the rollover text of the link from the gallery to the file; is that right?

If I understand the information you’ve provided, the issue can be re-stated as “HTML used in the title attribute of the [mla_gallery] links corrupts the link.” Is that accurate?

I will see if I can reproduce the issue and develop a fix. Thanks for your patience and for any additional information you can provide.

Hi David,

1. That was the actual value in the description. Thanks for noticing. I fixed the URL but I’m having the same problem. I think Chrome dev tools auto fixed the link in the image before. Let me paste the actual source from “view source” in the browser:

<dt class='gallery-icon'>
		<a href="https://skyscraper.org/cms/wp-content/uploads/2011/06/1941-26WS-HABS-plans-cover-sheet-LOC.jpg" title="U.S. Customs House plans from the 1941 Historic American Buildings Survey (HABS). Background: The building was originally designed as a custom house for the City of New York and was used as such until about 1860, when it was taken over as the United States Sub-Treasury.

The Historic American Buildings Survey (HABS) has been administered since 1933 to record America’s built environment in multiformat surveys comprising measured drawings, large-format photographs, and written histories for historic structures and sites dating from Pre-Columbian times to the twentieth century.
For the full set of plans and additional images see the <a href="https://www.loc.gov/pictures/search/?q=Drawing%3A+ny0363&fi=number&op=PHRASE&va=exact"> Library of Congress site </a>" class="colorbox-vws">
			<img width="300" height="300" src="https://skyscraper.org/cms/wp-content/uploads/2011/06/1941-26WS-HABS-plans-cover-sheet-LOC-300x300.jpg" class="attachment-vws" alt="1941 26 WS HABS plans cover sheet LOC" />
			<div style="position: absolute;"></div>
		</a>
	</dt>

It seems to me the href quote in the description breaks the output of mla-gallery so " class="colorbox-vws"> ends up being spitted independently.

2. Is it my vws markup? I reviewed it and didn’t find a problem but I may be wrong. Here it is:

<style type='text/css'>
	#[+selector+] {
		margin: auto;
		width: 100%;
	}
	#[+selector+] .gallery-item {
		float: [+float+];
		/*margin: [+margin+]%;*/
		text-align: center;
		width: 300px; height: 300px; overflow: hidden;
	}
	#[+selector+] .gallery-item .gallery-icon img {
		/*border: none;*/
	}
	#[+selector+] .gallery-caption {
		margin-left: 0;
		vertical-align: top;
	}
</style>
<!-- see mla_gallery_shortcode() in media-library-assistant/includes/class-mla-shortcodes.php -->

3. Yesh its a 300px by 300px center-cropped thumbnail size I registered.

4. The description is indeed ending up in the title attribute of but I didn’t know I can control that. I thought it’s just part of how mla-gallery renders it. I implemented the shortcode some time agoa dn may not remember all the settings and options, sorry.

No rush at all, thanks for taking a look.

Thanks for your update with the additional information. It looks like you have posted the source for your mla_style template but not your mla_markup template. That makes it harder to verify my theory of what is happening.

I was able to reproduce a variation of your symptoms on my test system. I copied your “(rather long) description” value into the Title field of an item (not the Description field). When I set mla_viewer=true, the value used for the title attribute is not encoded and the quote marks in your example value corrupt the resulting display. The Title field is the default value for the title attribute.

I will fix the defect in my next release, but you can avoid the problem in the interim with a simple change to your shortcode. Add mla_rollover_text="{+title+}" or mla_rollover_text="{+description+}" to your shortcode depending on which value you really want in the title attribute. When the mla_rollover_text parameter is present it is always encoded properly.

I will leave this topic unresolved until I hear back from you with the results of my suggestion. Thanks for working with me on this issue.

Ah sorry my mla-markup is

Open:
<div id='[+selector+]' class='gallery galleryid-[+id+] gallery-columns-[+columns+] gallery-size-[+size_class+]'>

Item:

<[+itemtag+] class='gallery-item'>
	<[+icontag+] class='gallery-icon'>
		<a href="[+filelink_url+]" title="[+description+]" class="colorbox-vws">
			[+thumbnail_content+]
			<div style="position: absolute;">[+caption+]</div>
		</a>
	</[+icontag+]>
	<[+captiontag+] class='wp-caption-text gallery-caption'>
		[+caption+]
	</[+captiontag+]>
</[+itemtag+]>

Row Close: <br style="clear: both" />

That’s it. It seems you already have a diagnostic though. I will try what you suggest and report back ASAP.

I added mla_rollover_text="{+description+}" to my shortcode but it didn’t solve my issue. I removed title="[+description+]" from my mla_markup which of course fixes it but I’m missing the tooltip now now.

Another option is to make sure the attachment description doesn’t have double quotes but if you think it’s important enough, I hope you can patch this when possible.

On that note, where do you keep the complete docs for the plugin? If somewhere. Is there a place I can read a reference of all the different options, shortcodes, and their parameters?

Thanks!

Thanks for posting the mla_markup template, which helps me see what you are trying to accomplish. Thanks as well for persisting and trying out the mla_rollover_text parameter. I regret any inconvenience caused by that ineffective suggestion.

Your application has illustrated a shortcoming in the [mla_gallery] shortcode processing which I had not appreciated until now. You are composing your own “filelink” in the template, using the Description field and adding a class attribute. The template expansion is a simple text replacement process, and it doesn’t know that [+description+] must be URL-encoded because it is used as an attribute value.

I have added a new “,attr” format option to encode substitution parameters used in an attribute value. With this new feature you can change your markup template to use [+description,attr+] and solve the problem.

I also noticed that your markup template includes the [+caption+] value twice; once in the <div style="position: absolute;">[+caption+]</div> and then again in the “captontag” markup that follows it. You may want to delete the “captiontag” portion of your template.

I have your e-mail address from an earlier support topic. I will send you an updated MLA version so you can test the new feature. When you have verified the fix I will make it available as the “Development Version” in the plugin repository. I will leave this topic unresolved until the fix is included in the next stable version of the plugin.

Thanks again for all your help in resolving this issue and inspiring a new feature.

Hey David,

Sorry for the super late reply.

Thanks a lot for the files. I did try this version but didn’t notice any difference. An <a> tag with a href value in quotes still breaks my HTML. Using single quotes works ok. I don’t mind marking this as resolved (with a workaround, in my case).

p.s. Thanks for the recommendation about removing my captontag tag. Did so. Honestly I don’t remember why I had that twice.

Jorge,

Thank you for the update; I regret you still experienced a problem with the quote marks. I did some more investigation and found that under some conditions WordPress will substitute “smart quotes” for quote marks in shortcode parameters. I have not found a fix for this in the MLA code. The problem only occurs for the first MLA shortcode on the page or post.

I did find another workaround. If you surround your shortcode with HTML <code></code> tags the substitution will not occur. If you need quotes in the shortcode, you can try this workaround.

Thanks again for your interest in the plugin and for your patience with this issue.

Awesome, thanks for the alternative workaround! You’re very responsive and helpful as usual. Cheers and no worries, we can operate around this issue. As a WP developer myself I understand there are limitations in the system which are pretty hard to overcome.