Home Forums Gutenberg Radio button that will add a color class to a list item


Radio button that will add a color class to a list item

  • I’ve got this very close! This is in a custom Gutenberg block but my issue is just with the basic php or something I have wrong. Here are the parameters:
    This is for a stylized unordered list block. I have custom fields in a repeater where they will be able to add each ‘list item/content’ using a text area in case the list will be a short paragraph, they are able to choose a bullet style (an icon), and the color of the bullets which is using a radio button; the radio button selection will add a class to the color (so far lite-color and dark-color). It is all working fine except right before the first list item there is a color choice rendering out to the front end – so for example it looke like:

    * Item one
    * Item two

    Here is my code for it:

    <div id="<?php echo esc_attr( $id ); ?>" class="<?php echo esc_attr( $classes ); ?>">
    $bullet_color = the_field('bullet_color');
    if($bullet_color=="lite-color") {
    	echo $lite-color;
    }elseif ($bullet_color=="dark-color") {
    	echo $dark-color;
    	<?php if ( have_rows( 'list_item' ) ) : ?>
    		<ul class="<?php the_field('center');?>">
    		<?php while ( have_rows( 'list_item' ) ) : the_row(); 
    		// var
    		$selection = get_sub_field('bullet_style');
    	if($selection=="asterisk") {
    		echo $ion-asterisk;
    	}elseif ($selection=="checkmark")   {
    		echo $ion-checkmark;
    	<li class="<?php echo $selection?> <?php the_field('bullet_color') ?>">
    	<?php the_sub_field( 'add_item' ); ?> </li>
    		<?php endwhile; ?>
    	<?php else : ?>
    		<?php // no rows found ?>
    	<?php endif; ?>

    Thank you!

  • I’m sorry I accidentally got that posted twice! I will check the other post; thank you!

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.