Search Results for 'Wysiwyg'

Hi,

When the terms and conditions page is created with ACF custom gutenberg blocks with an wysiwyg editor and there is a link within the content of the wysiwyg editor the output of this block on the checkout page of woocommerce in the Terms and conditions hidden preview block (the one that opens within the checkout page when you click on the terms and conditions link of the checkbox) contains the ACF block code instead of valid html output.

See image of generated html:
https://pasteboard.co/K8fPCY6.jpg

While debugging I have found that when the function “wp_kses_post” (this function calls wp_kses()) that filters the post content is removed the html output is just fine. So wp_kses_post does something that breaks the wysiwyg content when there is a link in the text.

The function is executed here:
Woocommerce wc-template-functions.php line 875:

/**
 * Output t&c page's content (if set). The page can be set from checkout settings.
 *
 * @since 3.4.0
 */
function wc_terms_and_conditions_page_content() {
	$terms_page_id = wc_terms_and_conditions_page_id();

	if ( ! $terms_page_id ) {
		return;
	}

	$page = get_post( $terms_page_id );

	if ( $page && 'publish' === $page->post_status && $page->post_content && ! has_shortcode( $page->post_content, 'woocommerce_checkout' ) ) {
		echo '<div class="woocommerce-terms-and-conditions" style="display: none; max-height: 200px; overflow: auto;">' . wc_format_content( wp_kses_post( $page->post_content ) ) . '</div>'; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
	}
}

When there is no link in the wysiwyg the output is just fine.

I cannot change this core woocommerce function without hacking into the plugin code. Has anyone an idea what I can do to fix this?

Hi everyone,

I’m using the ACF TinyMCE for a custom page builder due to it’s flexibility for the user. For some reasons I can’t wrap my head around empty p tags or line-break are randomly removed in the front-end and not visible in the editor itself.

There are tons of related issues already mentioned in the forum but none of them seem to fit my problem since its related to both ends of the UI. I was wondering if there is a current problem because I run the latest WP 5.7.2 and ACF Pro 5.9.6.

Any hint is appreciated as always.
Thanks in advance!
Marcel

Hello,

I’ve been building backend views with the ACF Flexible Content field for some years and I’m trying to switch to Gutenberg/ACF Blocks now.
My main issue with Gutenberg is, that the backend view differs from the frontend output – the editor might be confused by this.
That’s why I would prefer to output a raw Bootstrap view in backend and a styled Bootstrap-based view in frontend. So the difference between the both is so big that no editor would expect a wysiwyg backend view.

How can I embed Bootstrap 4 grid-only CSS in Gutenberg?

The Testimonial example (https://www.advancedcustomfields.com/resources/blocks/) would look like:

<section class="container">
 <div class="row">
<div class="col-12">
    <blockquote class="testimonial-blockquote">
        <span class="testimonial-text"><?php echo $text; ?></span>
        <span class="testimonial-author"><?php echo $author; ?></span>
        <span class="testimonial-role"><?php echo $role; ?></span>
    </blockquote>
    <div class="testimonial-image">
        <?php echo wp_get_attachment_image( $image, 'full' ); ?>
    </div>

    </div>
   </div>
</section>

Does this make sense?
Best
P

Hello, using ACF Pro, I’ve been trying to create some new styleselect options for the wysiwyg editor, as I need 3 new styles inside it (blockquotes with classes). As the wysiwyg uses the tinyMCE, and following the guide from wp codex https://codex.wordpress.org/TinyMCE_Custom_Styles, I tried inserting the following code in my functions.php

// Callback function to insert 'styleselect' into the $buttons array
function wpb_mce_buttons_2($buttons) {
    array_unshift($buttons, 'styleselect');
    return $buttons;
}
add_filter('mce_buttons_2', 'wpb_mce_buttons_2');

/*
* Callback function to filter the MCE settings
*/
function my_mce_before_init_insert_formats( $init_array ) {  
 
	// Define the style_formats array
	 
	$style_formats = array(  
	/*
	* Each array child is a format with it's own settings
	* Title is the label which will be visible in Formats menu
	* Block defines whether it is a span, div, selector, or inline style
	* Classes allows you to define CSS classes
	* Wrapper whether or not to add a new block-level element around any selected elements
	*/
		array(  
			'title' => 'Quote 1',  
			'block' => 'blockquote',  
			'classes' => 'quote-1',
			'wrapper' => true,
		),  
		array(  
			'title' => 'Quote 2',  
			'block' => 'blockquote',  
			'classes' => 'quote-2',
			'wrapper' => true,
		),
		array(  
			'title' => 'End quote',  
			'block' => 'blockquote',  
			'classes' => 'quote-end',
			'wrapper' => true,
		),
	);

	// Insert the array, JSON ENCODED, into 'style_formats'
	$init_array['style_formats'] = json_encode( $style_formats );  
		 
	return $init_array;  
	   
} 
// Attach callback to 'tiny_mce_before_init' 
add_filter( 'tiny_mce_before_init', 'my_mce_before_init_insert_formats' ); 

But it’s not adding the new stylesheets as expected. Any ideas on what’s wrong?

Using 2 extra plugins (Advanced Editor Tools AND TinyMCE Custom Styles) I get the result I want so it can surely be done, but that’s causing extra plugin dependencies, and I want to avoid that.

Having a flexible content with repeater that have few fields like title and wysiwyg.
Now this content, I need to have # -links to each of the looped content blocks.

If I use text input and rand with php, it is the same rand with all of the repeated fields -> does not work.

If I use the cleaned title field, all of the links will break if someone changes the title

If I use the loop index, it will break the link if the order of blocks is being changed.

So how could I make permanent slug for each of the repeated fields that does not change and that is something the content-editor user does not need to type ?

I have the WYDIWYG on a custom post type which I have displayed on a form on the frontend. Unfortunately the formatting bar does not show meaning the user is only able to write in plain text.

Is this a known issue?

Hi all! I’m trying to add a couple of new tabs to my WooCommerce product listings, and am following advice on how to do so with code (as my needs are “slightly” customized).

Here’s what I’m adding to functions.php to create the tabs:

if (class_exists('acf')) {
	add_action('acf/init', function() {
		$fields = [
			[
				'key' => 'field_tab_title',
				'label' => __('Directions', 'txtdomain'),
				'name' => 'tab_directions_title',
				'type' => 'text',
			],
			[
				'key' => 'field_tab_contents',
				'label' => __('Enter usage directions', 'txtdomain'),
				'name' => 'tab_directions_contents',
				'type' => 'wysiwyg',
				'tabs' => 'all',
				'toolbar' => 'full',
				'media_upload' => 1,
				'delay' => 0,
			],
			[
				'key' => 'field_tab_title',
				'label' => __('Ingredients', 'txtdomain'),
				'name' => 'tab_ingredients_title',
				'type' => 'text',
			],
			[
				'key' => 'field_tab_contents',
				'label' => __('List ingredients here', 'txtdomain'),
				'name' => 'tab_ingredients_contents',
				'type' => 'wysiwyg',
				'tabs' => 'all',
				'toolbar' => 'full',
				'media_upload' => 1,
				'delay' => 0,
			]
		
		];
 
		acf_add_local_field_group([
			'key' => 'group_custom_woocommerce_tabs',
			'title' => __('Custom Tabs', 'txtdomain'),
			'fields' => $fields,
			'label_placement' => 'top',
			'menu_order' => 0,
			'style' => 'default',
			'position' => 'normal',
			'location' => [
				[
					[
						'param' => 'post_type',
						'operator' => '==',
						'value' => 'product'
					]
				]
			],
		]);
	});
}

Except, on the back end, only the first two fields, for Directions, appear. The third and fourth fields I’m trying to create – the pair for ingredients – do not show up.

I can’t figure out what I’m doing wrong… can anyone advise?

Thanks!

Gravity Forms is aware of this issue, and my feeling is they will bounce me over to your team. So I’m jumping ahead, here it goes…

When adding an embedded GF form shortcode to an ACF WYSIWYG custom field, the WP bundled jQuery is not moved to the <head> as expected, and errors are thrown:
Uncaught ReferenceError: jQuery is not defined

The WYSIWYG field is simply wrapped in bootstrap classes.. “container/row/columns”

GF states they only support the default editor, otherwise Gutenberg. Whereas ACF WYSIWYG is Classic Editor.

All other Forms, added in the default editor, on my site are behaving normally.

Has your team experienced this specific scenario with WYSIWYG custom field and GFs?

I created a custom b, i, u toolbar, but I’d also like to add the read more functionality.
What should I add to my array?

function co_simplify_wysiwyg( $toolbars ){
	// Add a new toolbar called "Only B, I, U"
	// - this toolbar has only 1 row of buttons
	$toolbars['Only B, I, U' ] = array();
	$toolbars['Only B, I, U' ][1] = array('bold' , 'italic' , 'underline');

	// return $toolbars - IMPORTANT!
	return $toolbars;
}
add_filter( 'acf/fields/wysiwyg/toolbars' , 'co_simplify_wysiwyg'  );

Hi people,
is there a way to have a different default value for the select element for each repeater row?
For example, let’s imagine there is a repeater field with 2 items in it:

1. Select Field (Allow Null is off). Select List Items:
Sun
Water
Earth
Fire

2. A Wysiwyg field to enter some content.

Also the minimum and maximum rows has been selected as 4 for the repeater so it will always show 4 rows to start with but you can’t add more rows.

Now here the problem comes. In the current situation for all the repeater rows the select shows the first item “Sun” as selected value.

What I was looking for is if there is a way for the select to show the default items in order. So, for the first row the default items is “Sun” for second row “Water, for third row “Earth” and so on….

Is this actually possible to do? Is there any way to do it?

Hey everyone, so I am working on a project which is a website in which users can write a book or something on the website and then send it to another user on the website itself. So I want to place the wysiwyg field for those users who have an eaccount on my website so they can write what they want using it. So how can I implement this on my website I am a bit lost on this. Thank you so much for your help guyss

I am using the editor on the front-end with the Link button, but this button dialog have a small Link Options button which opens a pop-up window with all the posts and pages.

I am looking for a way, without any luck, to remove this Link Options button so that the user can see only the input for adding the URL and end Enter button.

Link to screenshot that shows the button.

Perhaps someone did it or knows a way to do it using PHP filters.

Hey everyone,

I have a client site that uses the TinyMCE Advanced plugin and I’m wanting to use a custom toolbar with a specific ACF wysiwyg field.

I have created a custom toolbar using the acf/fields/wysiwyg/toolbars add filter, but the TinyMCE plugin is overwriting my toolbar.

Does anyone know if there is a way to get around this? I would just remove the TinyMCE plugin, but the majority of the site makes use of it.

Appreciate any help!

Cheers,

The websites we build mainly consist of ACF fields. We don’t use Gutenberg at all and the Classic Editor plugin is installed on every single website.

My question refers to the ACF Wysiwyg fields:
Let’s say the Classic Editor won’t be available some day (maybe in 2023, 2024, …). What would that mean to all our existing ACF Wysiwyg fields? Are they dependent on the Classic Editor? Will they still work? Will ACF include its own copy of TinyMCE?

I would appreciate any kind of clarification or hints on future plans.

Thanks a lot.
Karl

Hi,

I am looking for a way to create following.

The current situation:
I have an option page with a repeater with a text subfield.
Client enters text values in the repeater subfield which generate WooCommerce product tabs with the correct labels.
These values are then dynamically filling a select field in the post/product edit screen, in this case a button group. All working fine.

The desired situation:
The content of the WooCommerce tabs need to be post/product specific.
So, when selecting a button in the post/product edit screen, a wysiwyg field needs to appear where the client can enter it’s specific content for the product. A bonus would be a true/false button to toggle the WooCommerce tab on/off.

I know how to create a field or field group in a php file but based on a selection from a select field remains a mystery.

Thanks you in advanced!

My shortcode [contact-form] renders a form („Contact Form 7“). 
I disabled WPAUTOP and it works in ‘the_content’, but not in an ACF custom field (WYSIWYG). It adds empty p-tags.

My code:

// shortcode
function my_form_shortcode($atts) {
  ob_start();
  $content = do_shortcode('[contact-form-7 id="377"]');
  return $content;
}
add_shortcode('contact-form', 'my_form_shortcode');

I disabled wpautop for CF7 with:

add_filter('wpcf7_autop_or_not', '__return_false');

and in wp-config.php with:

define('WPCF7_AUTOP', false);

How can I disable wpautop for this shortcode to work also in custom fields?

Hi,
i’m developing a website with 20 static pages, lots of custom post type, lot of content.
I manage the content with flexible layout fields, containing many fields and subfields.
I’d like to know if i can save the content of the subfields of my flexible layout field into a serialized array. I’m doing it nicely with repeaters fields but i can’t get it work with flexible content.

The way with repeater:
– 1 repeater field
– containing 1 image field , 1 text field, 1 wysiwyg

When the post is saved i call
add_filter(‘acf/update_value/name=my_repeater_field’, ‘or_update_flex_serialize’, 10, 4);
and it saves all the subfield of my repeater in a serialized array.
Then in post edit mode, i use load_value to load my content into the corresponding fields.

When i do the same with flexible content, it doesn’t work, i guess because flexible content is flexible and we have to say ACF there is xx number of text field, xx number of image field, … ?

Any clue ?
Thanks.

Hi,

I am using ACF pro and WordPress 5.7 with the flynt base theme and try to display the second sub_field if collapsed:

[
    'label' => __('Items', 'flynt'),
    'name' => 'items',
    'type' => 'repeater',
    'layout' => 'block',
    'collapse' => 'headline',
    'min' => 1,
    'max' => 4,
    'button_label' => 'Hinzufügen',
    'sub_fields' => [
        [
            'label' => __('Icon', 'flynt'),
            'name' => 'icon',
            'type' => 'text',
        ],
        [
            'label' => __('Headline', 'flynt'),
            'name' => 'headline',
            'type' => 'text',
        ],
        [
            'label' => __('Text', 'flynt'),
            'name' => 'text',
            'type' => 'wysiwyg',
            'toolbar' => 'basic',
            'media_upload' => 0,
            'delay' => 1,
        ],
    ],
],

Any ideas why it never shows anything?

So far values I tried: 0, 1, ”, ‘icon’, ‘text’ & ‘headline’

Hi,

I have added a an extra description under the Product category (product_cat) like a WYSIWYG input field.
So far soo good. I named it “extra description”

Ive installed a snippet plugin to add the php code.

Now i want to display this under the product category page in position “woocommerce_after_main_content”

So how will this code look like? Tried several php-snippets but it wont work , pleeease help.

My two cent, would be fantastic if this plugin would be able to add shortcodes so we just could put in easier. Thanks!

Users editing custom post types with ACF WYSIWYG’s on the screen are always defaulting to the “Text” tab. Changing to another tab does not seem to save as the default. This is a recent problem that seems to only be limited to users within a new user role we created that has the following capabilities:

Copy posts, create posts, delete others posts, delete posts, delete private posts, delete published posts, edit others posts, edit posts, edit private posts, edit published posts, manage categories, moderate comments, publish posts, read, read private posts, unfiltered upload, upload files

Admins and editors are not having a problem. Any advice on how to fix or troubleshoot this? Thanks!

I have added a field to a group, I need to change the order in which the field appears in the WordPress admin.

I create the group in the parent theme but add the field in the child theme, this works correctly but I cannot change the order in which the field is displayed.

 acf_add_local_field( array(
	 'key' => 'field_104624e64aad7',
	 'label' => __('Content', 'nmf'),
	 'name' => 'content',
	 'type' => 'wysiwyg',
	 'instructions' => '',
	 'required' => 0,
	 'conditional_logic' => 0,
	 'parent'       => 'group_5d4c3300b55ad',
 ) );

I have searched a lot but unfortunately I can’t find a solution for this.

In our WordPress themes we use a couple of shortcodes for some basic elements like buttons or columns. The shortcodes can be added to the WYSIWYG editor with a TinyMCE button. The button is visible within the default post/page WYSIWYG editor and also in the WYSIWYG editor of ACF.

Unfortunately the button is NOT visible within a WYSIWYG editor that is being used inside flexible content blocks (screenshot attached). I discovered the issue after updating from version 5.8.6 to version 5.9.1. Any suggestions on how to solve this issue? Thanks guys!

I have a wordpress project installed, which came from another user who uses ACF Pro. He use flexible Groups with a wysiwyg editor in it. I have to add a Field to add . It seems everything is setup with json. I found the json file, but how can I extend the editor with a new field. I also tried to hook into the filter, but it does not changed the editor. What is the right way? To do it in Json or in Functions.php with the hook?

Hi. I’m trying to populate excerpt in WP posts from a portion of the text entered into a WYSIWYG field. Is this possible?
This is the page https://cooperscript.ca/ The “our Fathers Comfort b” blog listing was created via ACF, and is not showing excerpt data.

Hi!

After the migration of my site one of my pages with ACF backendfields does not produce the same backend/admin-panel parameters than the original.

What has changed after migration is:

– The WYSIWYG/TinyMCE-Editors Buttons are completly missing
– The WYSIWYG/TinyMCE-Editors visual field is filled with the HTML tagged version of the text
– The style settings “Seamless ( no metabox )” are ignored for the whole field group and reset to “Standard (WP metabox)”

See attached source-site and after migration target-site of the error affected page.

Any idea why this did happen and how to fix it?

Thanks

Sascha