alexadark

Hi, my problem is not to render the fields
this is the site : https://cozy.webstantly.com/
all the sections of the home are a complex field group

the problem is not to display them, is to change their order, they still in the order as it’s written in the code
and not the one of the back office, where i can drag and drop them to change this order, but it doesn;t change in front

basically this is the code i use to display them (this is the code i used when i was trying the complex field before using it in a real project, so the code in the project is much more complex, but i realoze now that the demo as the same problem)

function wst_display_fields() {

	$layouts = carbon_get_the_post_meta( 'crb_layouts', 'complex' );
	var_dump( $layouts );
	if(isset($layouts)) {
	wst_display_driver($layouts);
	wst_display_teacher($layouts);
}

 }

function wst_display_driver($layouts){

	foreach ($layouts as $layout){

		if ( $layout['_type'] == '_driver' ) {
			$licence = $layout['license'];
			$name    = $layout['name']; ?>

			<h2>Driver</h2>
			<?php echo $name; ?><br>
			<?php echo $licence ?><br>
		<?php }
	}
}

function wst_display_teacher($layouts){
	foreach ($layouts as $layout){
		if ( $layout['_type'] == '_teacher' ) {
			$picture = $layout['picture'];
			$year    = $layout['years_of_experience']; ?>

			<h2>teacher</h2>
			<img src="<?php echo $picture ?>"
			     alt="">
			<?php echo $year ?>
		<?php }

	}
}function wst_display_fields() {

	$layouts = carbon_get_the_post_meta( 'crb_layouts', 'complex' );
	if(isset($layouts)) {
	wst_display_driver($layouts);
	wst_display_teacher($layouts);
}

 }

function wst_display_driver($layouts){

	foreach ($layouts as $layout){

		if ( $layout['_type'] == '_driver' ) {
			$licence = $layout['license'];
			$name    = $layout['name']; ?>

			<h2>Driver</h2>
			<?php echo $name; ?><br>
			<?php echo $licence ?><br>
		<?php }
	}
}

function wst_display_teacher($layouts){
	foreach ($layouts as $layout){
		if ( $layout['_type'] == '_teacher' ) {
			$picture = $layout['picture'];
			$year    = $layout['years_of_experience']; ?>

			<h2>teacher</h2>
			<img src="<?php echo $picture ?>"
			     alt="">
			<?php echo $year ?>
		<?php }

	}
}

btw, this is my code for the fields

use Carbon_Fields\Container;
use Carbon_Fields\Field;

Container::make( 'post_meta', 'layouts' )
         ->show_on_post_type( 'page' )
         ->show_on_page( 'home' )
         ->add_fields( array(

	         Field::make( 'complex', 'crb_block_layouts' )
		         ->add_fields( 'last_post',array(
			         Field::make( 'text', 'featured_id' )
		         ))
		         ->add_fields( 'four_next_posts',array(
			         Field::make( 'text', 'four_next_posts_title' )
		         ))
	              ->add_fields( 'four_block_posts', array(
		              Field::make( 'text', 'four_block_post_title' ),
		              Field::make( 'text', 'first_post_id' ),
		              Field::make( 'text', 'three_side_posts_id' ),
	              ) )
	              ->add_fields( 'two_col_posts', array(
		              Field::make( 'text', 'two_col_posts_title' ),
		              Field::make( 'complex', 'post_item' )
		                   ->add_fields( array(
				                   Field::make( 'text', 'post_id' )
			                   ) )
	              ) )
		         ->add_fields( 'text_area', array(
			         Field::make( 'rich_text', 'text_editor' ),
		         ) )
         ) );

Thank You

Great!

Nevermind, i have finally found how to write the code, so i paste it here as it can be useful to others
code to create the fields

<?php 

use Carbon_Fields\Container\Container;
use Carbon_Fields\Field\Field;

Container::make('post_meta', 'Custom Data')
	->show_on_post_type('page')
	->show_on_template('test-template.php')
	->add_fields(array(

		Field::make('complex', 'crb_layouts')
		     ->add_fields('driver', array(
			     Field::make('text', 'name'),
			     Field::make('text', 'license'),
		     ))
		     ->add_fields('teacher', array(
			     Field::make('image', 'picture'),
			     Field::make('text', 'years_of_experience'),
		     )),
	));

code to display the fields

function wst_display_fields() {

	$layouts = carbon_get_the_post_meta( 'crb_layouts', 'complex' );
	if(isset($layouts)) {
	wst_display_driver($layouts);
	wst_display_teacher($layouts);
}

 }

function wst_display_driver($layouts){
	foreach ($layouts as $layout){

		if ( $layout['_type'] == '_driver' ) {
			$licence = $layout['license'];
			$name    = $layout['name']; ?>

			<h2>Driver</h2>
			<?php echo $name; ?><br>
			<?php echo $licence ?><br>
		<?php }
	}
}

function wst_display_teacher($layouts){
	foreach ($layouts as $layout){
		if ( $layout['_type'] == '_teacher' ) {
			$picture = $layout['picture'];
			$year    = $layout['years_of_experience']; ?>

			<h2>teacher</h2>
			<img src="<?php echo $picture ?>"
			     alt="">
			<?php echo $year ?>
		<?php }

	}
}

But it would be great to have this type of examples in your docs, the code to create the fields and the code to create the fields with a simple example and some explanations for beginners, i would be happy to pay for a premium version with a full doc

I really like how short and readable is the syntax for creating fields!

Yes, i have seen this page, and as i have told i have no problem to create the fields, but now i don’t know how to display them
i would need a concrete example
with 2 differents complex fields in a multiple complex field

for ex with acf i was doing that, in a file named builder.php

i add

`function wst_display_builder() {

if ( is_page() ) {
// check if the flexible content field has rows of data
if ( have_rows( ‘wst_builder’ ) ):
// loop through the rows of data
while ( have_rows( ‘wst_builder’ ) ) :
the_row();

//Layouts
wst_display_parallax_row();

wst_display_icon_row();

wst_display_3_columns();

wst_display_cta();

wst_display_section_title();

wst_display_content();

endwhile;
endif;
}
}`

and in another named builder-functions.php

i add the functions for the different layouts

//parallax
function wst_display_parallax_row(){
	if ( get_row_layout() == 'wst_parallax' ) { ?>
		<section class="section -fw parallax" style = "background:url( <?php the_sub_field('wst_bg_image');
		?>)
			no-repeat fixed;
			-webkit-background-size: cover;background-size: cover; ">
			<div class="wrap">
				<div class="parallax-content"><?php the_sub_field( 'wst_text_on_bg' ); ?></div>
			</div>
		</section>

	<?php }
}

//icon row
function wst_display_icon_row(){
	if ( get_row_layout() == 'wst_icon_row' ) { ?>
		<section class="section icon-row <?php the_sub_field('wst_icon_row_class'); ?>">
			<div class="wrap">
				<?php if(get_sub_field('wst_icon_row_title')): ?>
				<h3 class="title"><?php the_sub_field( 'wst_icon_row_title' ); ?></h3>
					<div class="spacer"></div>
				<?php endif; ?>
				<?php if(have_rows('wst_icon_box')) : ?>
					<div class="box-container">
						<?php while ( have_rows( 'wst_icon_box' ) ) : the_row(); ?>
						<div class="box">
							<?php the_sub_field('wst_icon'); ?>
							<h4 class="title"><?php  the_sub_field('wst_icon_box_title'); ?></h4>
							<div class="text"><?php  the_sub_field('wst_icon_box_text'); ?></div>
						</div>
						<?php endwhile; ?>
					</div>
				<?php endif; ?>
			</div>
		</section>

	<?php }
}

//3 Columns
function wst_display_3_columns(){
	if(get_row_layout() == 'wst_3_col'){ ?>
		<div class="wrap section">
			<?php if(have_rows('wst_one_third_column')) : ?>
				<div class="separator"></div>
				<div class="three-columns-container">
					<?php while ( have_rows( 'wst_one_third_column' ) ) : the_row(); ?>
						<div class="one-third-column">
							<?php if (get_sub_field('wst_3_col_image')) : ?>
								<div class="hover-zommin">
									<a href="<?php the_sub_field( 'wst_3_col_button_link' ); ?>">
										<img src="<?php the_sub_field( 'wst_3_col_image' ); ?>">
									</a>
								</div>
							<?php endif; ?>
								<h4 class="title"><?php the_sub_field('wst_3_col_title'); ?></h4>
								<p class="text"<?php the_sub_field('wst_3_col_content'); ?></p>
								<?php if (get_sub_field('wst_3_col_button_text')) : ?>
									<a href="<?php  the_sub_field('wst_3_col_button_link'); ?>"
									   class="button -ghost"><?php  the_sub_field('wst_3_col_button_text'); ?></a>
								<?php endif; ?>
						</div>
					<?php endwhile; ?>
				</div>
			<?php endif; ?>
		</div>

<?php }

}

//CTA
function wst_display_cta(){
if(get_row_layout() == 'wst_cta'){ ?>
	<div class="section cta -fw ">
		<div class="wrap">
			<h3 class="cta-text">
				<?php the_sub_field('wst_cta_text');?>
			</h3>

			<div class="button-container">
				<a href="<?php site_url().'/'.the_sub_field('wst_cta_button_link'); ?>"
			                                  class="button">
					<?php the_sub_field( 'wst_cta_button_text' ); ?>
				</a>
			</div>

		</div>
	</div>
<?php }
}

//Title
function wst_display_section_title(){
	if(get_row_layout() == 'wst_section_title'){ ?>
		<h2 class="section-title">
			<?php the_sub_field('wst_title_text'); ?>
		</h2>
		<div class="spacer"></div>
	<?php  }
}

//Content
	function wst_display_content(){
		if(get_row_layout()== 'wst_content'){
				if(get_sub_field('wst_columns') == "col_1"){ ?>
					<div class="section -content wrap">
						<div class="content-columns">
							<div class="column <?php the_sub_field('wst_border'); ?>">
								<?php the_sub_field('wst_col_1'); ?>
								<?php if (have_rows('wst_tableau')) :?>
									<div class="tableau">
										<?php while(have_rows('wst_tableau')) : the_row(); ?>
											<div class="tableau-item">
												<?php the_sub_field('wst_icone_tableau'); ?>
												<div class="tableau-item-content">
													<h5><strong><?php the_sub_field('wst_tableau_item_title');
															?></strong></h5>
													<p><?php the_sub_field('wst_tableau_item_text');?></p>
												</div>
											</div>
										<?php endwhile; ?>
									</div>
								<?php endif;?>
								<?php if (get_sub_field('wst_contenu_sous_tableau')) :?>
									  <div class="contenu-sous-tableau">
									    <?php the_sub_field('wst_contenu_sous_tableau');?>
									  </div>
								<?php endif; ?>

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

				<?php }
			if(get_sub_field('wst_columns') == "col_2"){ ?>
				<div class="section wrap">
					<div class="content-columns">
						<div class="one-half first column <?php the_sub_field('wst_border'); ?>"><?php the_sub_field('wst_col_1'); ?></div>
						<div class="one-half column <?php the_sub_field('wst_border'); ?>"><?php the_sub_field('wst_col_2'); ?></div>
					</div>
				</div>

			<?php }

		}
	}

But as i say, a very simple example with 2 layouts will be enough to see the light

Yes i’m struggling to make a complex field with multiple fields, like i was doing in acf flexible content, that allow me to build a sort a custom builder with different layouts
i’m not working on a specific project, but testing the functionalities i need to see how i can use it.
I have understood how to create the fields, but now i don’t know how to display them (for this one, for the simple ones i’m ok)
In a general way, it would be nice to have example fields inside the plugin (as cmb2 does)
it would be the easier way to test everything

I use custom fields all the time, and i want to switch from acf to a library.
i considers yours and Piklist, about this last one carbon fields is it equivalent, does it have more functionalities, or other ones ?
perhaps lighter code ?

I am testing it, and it’s great.
for the simple fields it’s easy, and i love the short syntax.
and creating complex fields i have seen it can work like the flexible content ??
But it would be nice to have a complete code exemple to copy paste to test it for the complex field and particularly with multiples.
i’m struggling a little

another question, i like to have my custom fields appearing in first on a page (and eventually remove the default text editor) so i tried ->set_context(‘advanced’), but the cf still in last on the page…

i’m just scratching the surface, but it seems to do many more things than acf!
like the widgets etc…

Thank You Marin for your super fast answer!
i’m going to test all that as soon as i can ??