This is the technical support forum for WPML - the multilingual WordPress plugin.

Everyone can read, but only WPML clients can post here. WPML team is replying on the forum 6 days per week, 22 hours per day.

This topic contains 8 replies, has 2 voices.

Last updated by Shekhar Bhandari 5 months, 1 week ago.

Assigned support staff: Shekhar Bhandari.

Author Posts
May 11, 2019 at 6:25 pm #3791227

usahello

I am trying to test out the Classic Translator to see if it is a better fit for us than ATE. It seems to be working fine, but I noticed that the page renders with extra <p> tags inserted in all of the blocks as well as some empty <p></p> separating blocks.

A heading tag gets outputted like this:
<h3>
<p>
<a href="http://www.wpml.org">WPML</a>
</p>
</h3>

A list item gets outputted like this:

  • <p>
    Bullet 1 some text here
    </p>
  • I compared the rendered result from the Classic Translator vs. the ATE and you can see the differences (screenshots attached). Is there a WPML filter I can hook into to disable whatever you are adding to the content/blocks?

    May 13, 2019 at 3:49 am #3794779

    Shekhar Bhandari
    Supporter

    Languages: English (English )

    Timezone: Asia/Kathmandu (GMT+05:45)

    Hello there,

    Thanks for getting in touch, I can definitely help you out with this.

    I just tested the issue with adding the following code in the page and translating it and couldn't reproduce the issue you mentioned, no additional <p> tags were added, I suspect you are using Visual mode in the translation editor out of Visual/Text? Could you please try to use the Text mode and check the results once?

    <h3><a href="http://www.wpml.org">WPML</a></h3>
    <ul>
    <li>Hello</li>
    <li>Hello1</li>
    <li>Hello2</li>
    </ul>
    

    Anyway, to quickly check why there are additional <p> tags on your end, I think it will be better to check your site settings once, so, I would need temporary access (wp-admin and ftp) to your site.

    So could you please provide me those details, you will find the needed fields for this below the comment area when you log in to leave your next reply.
    hidden link

    This info is private and available to you and WPML supporters only.
    Read more about this: https://wpml.org/purchase/support-policy/privacy-and-security-when-providing-debug-information-for-support/

    Note:
    Backup your sites before providing the credentials or if possible provide credentials for the test site

    Look forward to receiving your answers so we can get to the bottom of this issue.

    Thanks

    May 14, 2019 at 3:39 am #3803199

    Shekhar Bhandari
    Supporter

    Languages: English (English )

    Timezone: Asia/Kathmandu (GMT+05:45)

    Hello there,

    I just tested on a fresh installation using visual/text mode and couldn't reproduce the issue, so it looks like some theme/plugin has a functionality to add the <p> tag automatically.

    Can you confirm that you are still experiencing issues with minimal set up (all plugins except WPML disabled and the theme on a WordPress default such as Twenty Nineteen)?

    For your new issue, may I request you to open a separate ticket so we can debug the issue separately?

    Handling one issue per ticket is included in our support policy to make it easy to discuss & provide feedback for the specific issue. Also, in the future, it makes easy for other users with the same problems to find the solution/suggestion quickly.

    Kind Regards,
    Shekhar

    May 14, 2019 at 5:26 pm #3809569

    usahello

    I tested with only WPML and ACF plugins active using the twentynineteen theme and the problem went away. I was able to isolate the issue to a custom plugin I'm writing. However, the issue is very perplexing. I disabled a lot of my code and found that the issue only occurs when I enqueue an admin script with the

    admin_enqueue_scripts

    hook. I couldn't find anything in my javascript code that was causing the issue and I actually found that the issue was happening when the .js file was totally blank. If I don't load the .js file with the

    admin_enqueue_scripts

    hook the problem goes away and if I load a .js file using that hook (even if the .js file has no code) then I see the issue happening. Do you have any thoughts?

    May 15, 2019 at 3:28 am #3811885

    Shekhar Bhandari
    Supporter

    Languages: English (English )

    Timezone: Asia/Kathmandu (GMT+05:45)

    Hello there,

    I am unaware of such issues with admin_enqueue_scripts.

    To confirm if it's a custom plugin issue or not, I request you to send me the whole line of code for the admin_enqueue_scripts so I can test it on a fresh install.

    Look forward to your reply.

    Thanks

    May 15, 2019 at 3:33 pm #3818423

    usahello

    I don't think you'll want my entire plugin code, so I did another test by using the admin_enqueue_scripts hook within the functions.php file of my theme. I can confirm the same thing is happening: if I use that hook and include a .js file (even if the .js file is empty) it'll cause the WYSIWYG elements in the Classic Translator to get <p> tags around the content.

    This is what I included in functions.php:

    function hello_test_script() {
       wp_enqueue_script( 'hello_test_admin', get_stylesheet_directory_uri() . '/dist/hello-test-admin.js', array( 'wp-plugins', 'wp-edit-post', 'wp-element' ), '1.0.0', true );
    }
    add_action( 'admin_enqueue_scripts', 'hello_test_script' );
    

    and this is what I put in the enqueued JavaScript file:

    ( function( $ ) {
       console.log('it is working');
    } )( jQuery );
    

    I then tested what happens if I remove all (or some of) the dependencies in the wp_enqueue_script call, which led to me finding that using 'wp-edit-post' as a dependency for the script is the problem.

    May 16, 2019 at 3:43 am #3821549

    Shekhar Bhandari
    Supporter

    Languages: English (English )

    Timezone: Asia/Kathmandu (GMT+05:45)

    Hello there,

    I just installed a fresh install of WordPress and you can log in to the test site using the following link: hidden link

    I added the code as you mentioned and translated a page, hidden link and I couldn't reproduce the issue at all.

    So could you please confirm if the issue exists here?

    Look forward to your reply.

    Thanks

    May 16, 2019 at 3:54 pm #3827737

    usahello

    Thank you for setting up the staging site. I just played around and found that the issue does indeed happen on that staging site as well. Go ahead and check out the French translation of that sample page now: hidden link

    The block that you used in the original language was a "Custom HTML" block, which isn't the type of block I was using when I saw this happening, I was using other blocks like the "List" and "Heading" blocks. This only happens on strings that show up in the WYSIWYG editors within the Classic Translation Editor, which seem to be strings that have some kind of markup in them such as <a> tags, italicized or bold text. So, a H2 block with an italicized word or a bullet list where one of the list items has some bold text or a link in it.

    I recorded a screencast of me adding a few blocks to the original page and then translating them using the Classic Translation Editor. You can see that unwanted <p> tags are added when you toggle the WYSIWYG translation elements from Text to Visual mode and back. Here is the link to the video I recorded: hidden link

    Since I don't have FTP access, I'm curious to know what happens if you un-enqueue the script that was hooked into admin_enqueue_scripts and/or remove the 'wp-edit-post' dependency on that script.

    May 17, 2019 at 3:56 am #3831307

    Shekhar Bhandari
    Supporter

    Languages: English (English )

    Timezone: Asia/Kathmandu (GMT+05:45)

    Hello there,

    When 'wp-edit-post' dependency is removed the issue is not happening, so I request you to either follow the below one solution:

    - Edit the page only in Text Mode

    - Remove the wp-edit-post dependency.

    I am sorry to let you know that further help on making the code work properly will fail under the custom code, which is outside the scope of our support,

    At this point, I would suggest you consider contacting one of our certified partners from this link: http://wpml.org/documentation/support/wpml-contractors/

    Before doing so please have a look also here:
    http://wpml.org/documentation/support/wpml-contractors/guidelines-for-people-looking-for-consulting-help/

    You will get the custom assistance you need to get on with your project.

    Thanks