[Resolved] Custom field display is not wrapping correctly around inline centered image

[Martin]

This problem does not exist when I switch to the 2020 theme so I assume it is a GeneratePress issue. I asked Toolset and they could not reproduce it at their end.

I have a local site in development where a custom field is not displaying the text around an image properly. I have been using the toolset [wpv-autop] shortcode fix to display my WYSIWYG custom fields and while the paragraph divisions show up, there is a problem with the display of images (see pic in link where I highlight the problem in red). When an image is formatted in the WYSIWYG editor as no wrap for the text, that is ignored. (the text should appear before and after the image not beside it).

https://toolset.com/wp-content/uploads/2020/02/1517135-2020_02_19_12h21m.jpg

Here is the text code around that part of the problem in my custom field (I’m using Toolset Types and Views).

Works by Nani Bell Gonawabi, Lindsey Bond, Liam Coo, Shifra Cooper, Iehente Foote, Alana Forslund, Braiden Houle, Kelty Jean, Aaron Leon, Jackie Omstead, Jamie Oshkabewisens, Adrienne Marcus Raja, Nikki Shaffeeullah, Arie van de Ven and many more were on display at the launch. 375 photos from 21 different travellers!
<blockquote>
<p dir="ltr" lang="en"><a href="https://twitter.com/hashtag/TERRAINofTHOUGHT?src=hash">#TERRAINofTHOUGHT</a>, 375 photos from 21 <a href="https://twitter.com/hashtag/TofTCanada?src=hash" target="_blank" rel="noopener">#TofTCanada</a> travellers! Prints thnx 2 <a href="https://twitter.com/ArtifactUprsng" target="_blank" rel="noopener">@ArtifactUprsng</a>! <a href="https://t.co/cCIktZLAWB">https://t.co/cCIktZLAWB</a> <a href="https://t.co/EjExf9Yrn7" target="_blank" rel="noopener">pic.twitter.com/EjExf9Yrn7</a></p>
— Jumblies Theatre (@jumbliestheatre) <a href="https://twitter.com/jumbliestheatre/status/725399352949264384" target="_blank" rel="noopener">April 27, 2016</a></blockquote>
<script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>
 
<img class="aligncenter" src="https://icasc.local/wp-content/uploads/public_html/sites/default/files/screen-shot-2016-05-16-at-11-42-59-a-m_0.png" alt="" width="584" height="587" />
 
<img class="aligncenter" src="https://icasc.local/wp-content/uploads/public_html/sites/default/files/screen-shot-2016-05-16-at-11-38-07-a-m1_0.png" alt="" width="520" height="456" />
 
The night also included a screening of a short documentary about Tracks: 7th Canadian Community Play and Arts Symposium and the Vancouver launch of Train of Thought, produced by the Vancouver Park Board and Vancouver Moving Theatre. Savannah Walling, Artistic Director of Vancouver Moving Theatre, introduced the film.
 
Watch the documentary below or <a href="http://www.trackssymposium.com/documentation.html" target="_blank" rel="noopener">here</a>.
 

 
Exploratory questions from the Train of Thought's <a href="http://trainofthought.co/about.html">About </a>page:
<blockquote><strong>Train of Thought </strong>will ask many questions: What's not on the map? What other forms of mapping are there? How can we see the places where we live through new eyes? What protocols are there of arrival, gathering and departure for the territories we pass through? What place names can we learn and imagine? What stories are important to pass across the country? How can we grieve and celebrate together in the shadow of colonialism? How can community-engaged arts help us enter into these questions?</blockquote>
Other related articles:
<a href="http://www.cacv.ca/train-of-thought-tracking-change" target="_blank" rel="noopener">Train of Thought: Tracking Change</a> - Via Community Arts Council of Vancouver
<a href="http://trainofthought.co/assets/alt.theatre-12.1_ange-loft_train-of-thought-goes-off-the-tracks.pdf" target="_blank" rel="noopener">Alt.theatre magazine "Train of Thought Goes Off the Track"</a> - Via Alt.theatre and Ange Loft
 

I would appreciate some help in figuring this out. Many thanks.

[David]

Hi there,

thats peculiar – looks like some Float CSS is at play.
What happens if you remove the aligncenter class from the img tags ?

[Martin]

Removing the aligncenter class looks fine in the WYSIWYG editor but no change on the front-end?

[Tom]

Strange, any change if you add this code?:

add_action( 'after_setup_theme', function() {
    add_theme_support( 'wp-block-styles' );
} );

Let me know 🙂

[Martin]

No change. I entered into the Snippets plugin and activated it everywhere. But the text still wraps?

[Tom]

Is there any way we can see the site? I know you mentioned it’s local at the moment, but is there any way we can put it up on a temp live server?

[Martin]

I could send it with duplicator? Just tell me how to get the file to you…

Or also I use Local by Flywheel (which is FREE and absolutely the easiest way to do a local site by the way, better than MAMP etc in my opinion). It has a simple export to a .zip which can be dragged onto Local and presto you have the site! (magic!)

If you want to try the Local way just let me know, otherwise I can send a duplicator file. (just a few more steps).

Shouldn’t take long to send it to you across the Georgia Strait from Vancouver (wink).

[Martin]

If you send me a private link I can email the link to my site on google drive (75MB) which you could install as a duplicator package. It has no images to reduce the size. I could send the images for that page if you like? (with the local url for the problem page). I hope I’m not asking too much?

[Tom]

Local by Flywheel actually has an option to generate a “live link” to your site. It’s temporary, but if you can share the URL, one of us can likely get to it before it expires. If the timing doesn’t work, we may need to figure out a specific time to make the link go live.

Let me know if that works for you or not 🙂

[Martin]

I don’t host with Local by Flywheel so I don’t understand how that would work?

[Tom]

I thought you mentioned above that you’re using Local by Flywheel? You don’t actually need to host with them if you’re using their local server, there’s a live link feature here: https://www.screencast.com/t/RWbjpgSs

Let me know 🙂

[Martin]

OK, I saw that sorry. I was afraid to click it. I won’t get hacked will I?

Here is the page with the image wrap problem in my site:
https://icasc.local/from-train-of-thought-to-terrain-of-thought/

Do you need to login? Probably need a private message to send you the login?

Here is the Enable link for the site from Local live link:

Not sure how long it stays up but I’ll keep my LOCAL open on the Mac.

[Martin]

I see the Enable Live link seems to have become overloaded or something. What should I do? Disable it and try again? Sorry.

[Tom]

Hmm, I’m seeing that too. Maybe disable the live link and then re-enable, that should generate a new link.

Instead of sharing the link publicly, edit your original post and add it to the Website URL field – that way only we can see it 🙂

[Martin]

Ok thanks here is a link

[Author]

Posts