Search Results for 'Wysiwyg'

Hey,

The issue is that Shortcake is getting confused when editing a wysiwyg inside the ACF Options Page. Everything still works, but Shortcake shows the message “Something’s rotten in the state of Denmark” instead of the actual shortcode text.

I know Shortcake is the culprit here.

I wanted to see if anyone has encountered this and built a workaround.

I found the spot in Shortcode that creates the issue here: https://github.com/wp-shortcake/shortcake/blob/master/inc/class-shortcode-ui.php#L436

It’s checking to see if the current user can edit the current post, but since it’s not a real post it gets confused.

Hey folks,

When I used Flexible Content and then the wysiwyg field it will not put my content into the defined <p> tag, but rather it’s own and create a separate empty one below that.

Here is a video showing the issue. Anyone seen this before? https://www.youtube.com/watch?v=Xr0qOrsoxlw

Running WP 5.9 / ACF Pro 5.1.14 / ACF Extended 0.8.8.7

Cheers

is someone know how to get the first image in Wysiwyg Editor? my field type is Wysiwyg Editor and i put images there using add media.

i try this code but its not working

<?php 
   $images = get_field('images'); 
   $firstimage = $images[0]; 
?>    

<img src="<?php echo $firstimage['url']; ?>" /> 

Hi there,

I have some programming skills but this I can’t seem to figure out.

I would like to add a ‘align in both sides’ of ‘justify text’ option in the wysiwyg text editor in the front-end. This option should use the combination of ‘align to the right’ and ‘align to the left’ at the same time so that both sides are lined up.

How can I do that?

Thank you so much for your time,
Gorka

Im using custom post types and a have added several fields into my custom post type.

I’m using WPforms as well and there is add form button next to add media button in wysifyg editor.

For some reason when adding wpforms shortcode into wysiwyg editor text field form is not working in frontent.

Message is “Please enable JavaScript in your browser to complete this form.” Everything is enabled so thats not the case.

When adding the same shortcode into basic ACF text area field, it works just fine. The problem seems to be only in wysiwyg field and only when it is added with acf because When i add the same code for example into simple page with wordpress wysiwyg editor, it also works.

Anyone else had this problem?

wysiwyg field data used to be stored without paragraphs but with linebreaks.

Now, when opening an existing post, if I switch the editor to the text editor, all linebreaks will be removed and the the whole text will become one liner (one paragraph).

Is there any change on how this is handled in ACF pro?
Or maybe any other change on WP?

How to assign random ID to headings (h1,h2,h3,h4 exc) in AFC WYSIWYG field?
I need to print content in various languages without using polylang or WPML, so i’ve decided to build ACF WYSIWYG fields, in which i put content in various languages. My post are printed by elementor templates depending on category, so i can use tabs widget to switch between ACF field.
The facts is that i use also TOC widget to anchor various chapters by their headings, but when template prints content, the anchor headings are progressive and the same for all languages.

I’ve managed to solve this manually, writing by myself an ID into <h> tag, in order to let anchors work, but i need to automate this process.

I’ve found some snippets to put into functions.php but only for POST CONTENT, not for ACF fields.

Thanks in advance to all

When I retrieve a wysiwyg field via the new REST API integration in ACF 5.11.1, the string returnted in JSON contains all html tags except <p> paragraphs.

I’m using the repeater field together with the wysiwyg field.

Has anyone a clue of what can I do to format correctly the output ?

I have a dark based theme with a black background (I know… horrible but wasn’t my choice)… I’m trying to style the background of one of my Wysiwyg editors to black so that when I make the text white I can see it.

I added the class “event_wysiwyg” to the wrapper attributes of the field in question.

I added the following code to functions.php file

function my_acf_admin_head() {
    ?>
    <style type="text/css">

    .event_wysiwyg .mceContentBody{
    	background-color: #000 !important;
    }

    </style>
    <?php
}

add_action('acf/input/admin_head', 'my_acf_admin_head');

The class is showing up when I inspect the event_wysiwyg field. If I change the styles of anything outside of the wysiwyg it works but since the wysiwyg is an iframe it doesn’t seem to work. I also tried styling #acf-editor-49_ifr .mceContentBody.

Hello,

I am using the ACF Frontend Form Widget to provide a Wysiwyg Field. That field comes with an Add Media Button. For Some reason the Text on the button is white on a white background and the window which opens to add media files is in the same scheme. Also the input field itself when enteriing text has a white background.

How can I change those colors? I tried all availably style options linked to the fields but I cannot find the proper one. The color when inputing text and the add media dialog doesn’t change.

Thanks for helping an absolute beginner.

BR
Manfred

I have a few of customizations for my WP editor:
* custom color swatches (in a specific order)
* 5 JS plugins to do things like create placeholders, insert icons or shortcodes, ect
* a ton of custom formats
* various other visual components via CSS

these are all added via WP hooks like “tiny_mce_before_init”, “mce_buttons_4”, and “mce_external_plugins” and these word fine for the regular EP editors. These also work as expected for ACF WYSIWYG fields BUT ONLY when a WP editor field is also on the page.

If I put a WYSIWYG field on an options page, or a taxonomy term edit page then none of my custom options are there. If you use Automattic’s “Advanced Editor Tools” plugin to say add a font family button or add font colors – those buttons WILL appear, but they will be missing any custom settings added via “tiny_mce_before_init”.

Looking at the WP source code, it looks like WP takes the user settings and spits them out as a JS object and adds that the the JS to build the tinymce instance: https://github.com/WordPress/WordPress/blob/master/wp-includes/class-wp-editor.php#L1566

It doesnt seem that this is run for the ACF instances of the editor. I put a var_dump & die statement in there which will print on an edit post page but will NOT print on say an option page with the ACF editor in it.

Hi together,

I need your help for once.
I have a sub-field (WYSIWYG) that is to be played out via schema.org JSON-LD.
The field contains links to other URLs. And for these links the inverted commas (“) have to be masked.
I tried this with the function addslashes. Unfortunately, this did not work.
Here is my code example:

<?php 
	$fcount=count($faq);
	if ( $faq ) : ?>
	<script type="application/ld+json">
	{
		  "@context": "https://schema.org",
		  "@type": "FAQPage",
		  "mainEntity": [
			<?php if ( have_rows( 'faq' ) ) : $ftemp=1; ?>
				<?php while ( have_rows( 'faq' ) ) : the_row(); ?>
				{
					  "@type": "Question",
					  "name": "<?php the_sub_field( 'question' ); ?>",
					  "acceptedAnswer": {
						"@type": "Answer",
						"text": "<?php addslashes(the_sub_field( 'answer' ), '"'); ?>"
						}
						}<?php if($ftemp<$fcount){ ?>,<?php } ?>
				<?php $ftemp++; endwhile; ?>
			<?php else : ?>
				<?php // no rows found ?>
			<?php endif; ?>
				]
	}
	</script>
<?php endif; ?>

Do any of you have an idea how I can solve the problem?

Thanks a lot
Michael

Hi,

How can I remove the media upload button from the WYSIWYG content area on a front end ACF Form please?

I’ve added uploader => basic but that doesn’t change anything.

Thanks

It would be great, if there was a “info”-field that could contain wysiwyg (html, text + images) and the field would be editable only in the “Field Group” -editor.

In page/post edit view it would only render as in static html.

This could help us create info areas for content editors.

Hello, first, thanks for acf it’s amazing !

I come today to, if possible, get help about and edge case that doesn’t make sense to me. I’m using ACF to generate custom blocks + i’m using ACF js api to customise tinymce ( custom init settings, toolbars and a custom button ).

Toolbars and init settings are working as intended.

The thing is, when loading tinymce in backoffice every postmeta is duplicated in the database. It causes problems to save changes and it’s a pain to deal with once datas start getting duplicated.

My first guess is, my function to add custom button to editor is bad. I tought i understood the tinymce setup function just right but it seems like i dont.

Things i already tried to fix my problem before posting here to get help if possible :
Using wysiwyg_tinymce_init in place of wysiwyg_tinymce_settings to store my setup function, problem being, when switching the block from edit to view i lose my custom tinymce button.

So my questions are : what am i doing wrong with my custom button ? what are the good practices to add button to tinymce using ACF api ?

acf.add_filter('wysiwyg_tinymce_settings', function( mceInit, id, field ){
    mceInit.verify_html = false;
    mceInit.plugins = 'textcolor,colorpicker,lists,fullscreen,image,wordpress,wpeditimage,wplink,hr';
    mceInit.toolbar1 = 'formatselect,bold,italic,underline,strikethrough,forecolor,blockquote,hr';
    mceInit.toolbar2 = 'alignleft,aligncenter,alignright,alignjustify,bullist,numlist,link,unlink,undo,redo,removeformat,customButton';
    mceInit.setup = function(ed){
        ed.addButton( 'customButton', {
            type: 'button',
            text: 'Ajouter un bouton',
            onclick: function() {
                ed.insertContent('test');
            }
        });
    }
    return mceInit;
});

I’m migrating a very (very) old Expression Engine website to WordPress. I managed to generate an XML template on the old site and migrate the posts to WordPress using the default WP Importer. I also managed to map and successfully import the old custom fields content to the new fields I created in WordPress using ACF Pro. These are all wysiwyg fields, by the way.

I did some tests a few weeks ago and everything seemed to work. However, today when I started migrating the content I found out the WordPress is not importing the content of the custom fields. All the other details are imported correctly (author, category, date).
This happens both on my local and staging install. I’m wondering if it could be something related to a plug-in update? I haven’t made any changes to my WP install, I simply worked on the child theme, and haven’t touched the custom fields settings.

I am working on a website leveraging the ‘Flexible Content’ type within ACF. One of the child layouts has a single Text element of ‘Wysiwyg Editor’ type.

I’ve installed the ‘Columns Shortcode’ plugin as I’d like to be spread out location information across 3 columns. The columns are displaying fine, but the background for the parent div doesn’t appear to be expanding when columns are being used in that Wysiwyg element. It’s almost like it’s not recognizing when the floatable column divs are breaking to the next line. I have confirmed the background div will expand when it’s straight text.

Is that a known issue? Should I approach this solution from a different angle?

Any help would be greatly appreciated.

Hello,

is it possible to add own OL/UL styles to the ACF WYSIWYG field?
I need some different UL classes. Is there an example?
It seems to be possible with the classic editor…

Best
P.

Hi, I’m trying to create a group field for each term attached to this custom post.

Like this:

Say my CPT is for this product: Wood Panels and this can be used for Facade, Floors and Interiors (these are the selected terms).

I need to create the field groups for each, but I tried to do this by PHP, I tried something like this:

function create_field_groups() {
  global $wpdb;

  // general fields
  // everything goes ok here
  acf_add_local_field_group(array(
    'key'    => 'group_1',
    'title'  => 'Product Data',
    'fields' => array(
      array(
        'key'       => 'field_1',
        'label'     => 'Product',
        'type'      => 'tab',
        'placement' => 'top',
        'endpoint'  => 0,
      ),
      array(
        'key'   => 'field_2',
        'label' => 'Short Description',
        'name'  => 'product_short_description',
        'type'  => 'wysiwyg',
      ),
      // etc...
    ),
    'location' => array(
      // etc...
    ),
  ));

  // querying DB to get terms in taxonomy
  $query = 'SELECT DISTINCT
              t.name, t.slug 
            FROM
              wp_terms t 
            INNER JOIN 
              wp_term_taxonomy tax 
            ON 
              tax.term_id = t.term_id
            WHERE 
              (tax.taxonomy = \'my_taxonomy\')';

  $terms = $wpdb->get_results($query, ARRAY_A);

  // if we get terms then create group fields for this term
  if ($terms) {
    foreach ($terms as $term) {
      $slug = $term['slug'];
      $name = $term['name'];

      acf_add_local_field(array(
        'key'       => 'field_1_' . $slug,
        'label'     => $name,
        'type'      => 'tab',
        'placement' => 'top',
        'endpoint'  => 0,
        'parent'    => 'group_1',
      ));

      acf_add_local_field(array(
        'key'    => 'field_2_' . $slug,
        'label'  => 'Short Description',
        'name'   => $slug . '_short_description',
        'type'   => 'wysiwyg',
        'parent' => 'group_1',
      ));

      // etc...
      
    }
  }
}
add_action('acf/init', 'create_field_groups');

With this function I can generate the first part of the fields, but when I try to create the terms fields instead of getting four different tabs, I just get one from the last term.

How can I fix this?

I am experiencing ACF wisywyg fields not showing its formatting options on certain pages. I checked the settings in field groups and it is toggled on visual and text. what can be the cause of the problem. it is ok in other pages.

I have an ACF wysiwyg editor where I need to put a link in as raw text/html

like:

<a class="home-hero-tc-cta" href="https://web.com/pagename?utm_campaign=campaign%20name&utm_source=Homepage%20Hero&utm_medium=From%20the%20homepage">Register Now</a>

but it remove the question mark and breaks so it does

<a class="home-hero-tc-cta" href="https://web.com/pagenameutm_campaign=campaign%20name&utm_source=Homepage%20Hero&utm_medium=From%20the%20homepage">Register Now</a>

and it 404s.

https://www.reddit.com/r/Wordpress/comments/btazok/wordpress_stripping_code_from_acf_fields/

>For the text field for custom scripts, is it a WYSIWYG field or just a textarea field? WordPress does not like scripts in WYSIWYG fields, it will remove them altogether if on the Visual Editor portion and saving. If on HTML view, they likely would be retained but in general WP does not want scripts/HTML code in WYSIWYG fields.

It’s WYSIWYG and its not a script

https://support.advancedcustomfields.com/forums/topic/regression-backslashes-stripped-in-wysiwyg/

not backslashes

I can’t find anything online explaining this.

How do you keep question marks in WYSIWYG editor in wordpress acf to keep question marks in url

It seems like HTML tags only work for the first WYSIWYG editor; the succeeding WYSIWYG editors will just output the raw HTML tags as if they’re part of the content.

For the link type, it does not output anything on the front-end.

I’ve updated WordPress and the plugin. I also uploaded the “Classic Editor” plugin but also to no avail.

I have also tried to disable all the other plugins to check if there’s a conflict, still, the issue persists.

Am I missing anything? Thanks.

Hi people.
Is there a way to prepopulate an ACF WYSIWYG field with dummy content? I’m trying to put a placeholder text inside the WYSIWYG field, ej:

Put your title here
Lorem ipsum dolor sit amet…

So “Put your title here” should be in ‘Title 2’ style and “Lorem ipsum” in paragraph style.

Hello,

Somehow my account got deleted on my other email where my ACF license is bought. So here I am with an new account! 🙂

Im making gutenberg blocks with acf but I would like to combine the gutenberg wysiwyg editor with and acf image field. Is this posible? Can’t find any info online.

So I want to make an block with an image field + wysiwyg (but not the classic tinymce version).

Hello, I’ve done a lot of research, but I couldn’t find a way to add 2 custom fields in woocommerce tabs, does anyone know the code I can add in (functions.php)?

if( function_exists('acf_add_local_field_group') ):

acf_add_local_field_group(array(
	'key' => 'group_60e453ae778e4',
	'title' => 'Informações extras',
	'fields' => array(
		array(
			'key' => 'field_60e4542928613',
			'label' => 'Medidas',
			'name' => 'medidas',
			'type' => 'wysiwyg',
			'instructions' => '',
			'required' => 0,
			'conditional_logic' => 0,
			'wrapper' => array(
				'width' => '',
				'class' => '',
				'id' => '',
			),
			'default_value' => '',
			'tabs' => 'all',
			'toolbar' => 'full',
			'media_upload' => 1,
			'delay' => 0,
		),
		array(
			'key' => 'field_60e4543628614',
			'label' => 'Troca e Devolução',
			'name' => 'troca',
			'type' => 'wysiwyg',
			'instructions' => '',
			'required' => 0,
			'conditional_logic' => 0,
			'wrapper' => array(
				'width' => '',
				'class' => '',
				'id' => '',
			),
			'tabs' => 'all',
			'toolbar' => 'full',
			'media_upload' => 1,
			'default_value' => '',
			'delay' => 0,
		),
	),
	'location' => array(
		array(
			array(
				'param' => 'post_type',
				'operator' => '==',
				'value' => 'product',
			),
		),
	),
	'menu_order' => 0,
	'position' => 'normal',
	'style' => 'default',
	'label_placement' => 'top',
	'instruction_placement' => 'label',
	'hide_on_screen' => '',
	'active' => true,
	'description' => '',
));

endif;