Support

Account

Home Forums Front-end Issues Displaying a group outside WordPress Loop

Solving

Displaying a group outside WordPress Loop

  • I am trying to display the below code outside wordpress loop using ajax tabs.

    My Tabs are like this

    <!-- Tab links -->
    		<ul class="tabs">
    			<li><a href="<?php
        echo get_stylesheet_directory_uri();
    ?>/includes/tabs/specs.php" class="tab">Data</a></li>
    			<li><a href="#tab_2">Overview</a></li>
    		</ul>

    I want to display the below code inside my tab “data”. But it’s not working. This code working perfectly on other pages inside a loop.

    <?php
     $group_ID = 12113;
     $fields = get_fields($groupID);
    
     $fields = get_field_objects();
    echo '<div class="aps-column">';
    echo '<div class="aps-group">';
    echo '<ul class="aps-specs-list">';
    
              if( $fields )
              {
                foreach( $fields as $field_name => $field )
                {
                  if( $field['value'] )
                  {
                      echo ' <li>';
                        echo '<strong class="aps-term">' . $field['label'] . '</strong>';
    echo '<div class="aps-attr-value"><span class="aps-1co">' . $field['value'] . '</span></div>';
    echo '</li>';
                    }
                }
              }
    echo '</ul>';
    echo '</div>';
    echo '</div>';
      
    ?>
  • Hi @jazibzaman ,

    Thanks a lot for reaching out to us.

    The field groups function expects you to provide the posts ID and not the field group ID.

    I hope this helps.

  • Hi @James
    Thanks for your reply. The issue is i want this code to pickup the post id automatically. But this is not in wordpress loop. How can i achieve this?

  • Hi @jazibzaman

    It depends on how do you show the tab. You can always try to get the post object from the global post like this:

    global $post;
    $post_ID = $post->ID;

    But if your tab doesn’t set the post object, that code won’t be working.

    Could you please explain to me how this tab works?

    Thanks!

  • James, The Tab is working using Ajax. Here is my page template that is set for tabs.

    <?php
    Template Name: Single Post with data
    */
    //* Enqueue tab js including jQuery UI Tabs
    add_action( 'wp_enqueue_scripts', 'my_load_tab_script' );
    function my_load_tab_script() {
    	wp_enqueue_script( 'my-tabs', get_stylesheet_directory_uri() . '/assets/js/my-tabs-ajax.js', array( 'jquery-ui-tabs' ), '1.0.0', true );
    }
    //* Remove the post content and add our tabbed content
    remove_action( 'genesis_entry_content', 'genesis_do_post_content' );
    add_action( 'genesis_entry_content', 'my_do_tabbed_content' );
    function my_do_tabbed_content() {
    ?>
    	<div id="tab-wrap">
    
    		<!-- Tab links -->
    		<ul class="tabs">
    			<li><a href="#tab_1">Overview</a></li>
    			<li><a href="<?php echo get_stylesheet_directory_uri(); ?>/includes/tabs/data.php" class="tab">HTML</a></li>
    		</ul>
    
    		<div class="my-tab-content">
    			<!-- Tab content - id must match the href from the tab link -->
    			<div id="tab_1">
    				<?php the_content(); ?>
    			</div>
    
    		</div>
    
    	</div>
    <?php
    }
    //* Run the Genesis loop
    genesis();

    and here is my data tab file data.php

    <?php
    // Include WordPress
    define('WP_USE_THEMES', false);
    require_once('../../../../../wp-load.php');
    
     $group_ID = 12113;
     $fields = get_fields($groupID);
    
     $fields = get_field_objects();
    echo '<div class="aps-column">';
    echo '<div class="aps-group">';
    echo '<ul class="aps-specs-list">';
    
              if( $fields )
              {
                foreach( $fields as $field_name => $field )
                {
                  if( $field['value'] )
                  {
                      echo ' <li>';
                        echo '<strong class="aps-term">' . $field['label'] . '</strong>';
    echo '<div class="aps-attr-value"><span class="aps-1co">' . $field['value'] . '</span></div>';
    echo '</li>';
                    }
                }
              }
    echo '</ul>';
    echo '</div>';
    echo '</div>';
      
    ?>

    I tried a lot of code but as i am not a php professional i am doing some mistake. Thanks again for your kind support.

  • Hi @jazibzaman

    Did you try the global variable solution I gave you before?

    Also, could you please check if your data.php can get extra parameters from the $_GET variable like the following?

    In template:
    <li><a href="<?php echo get_stylesheet_directory_uri(); ?>/includes/tabs/data.php?postid=123" class="tab">HTML</a></li>

    In data.php:
    $group_ID = $_GET['postid'];

    This page should give you more idea about it: http://php.net/manual/en/reserved.variables.get.php.

    Hope this helps!

  • Hi @James, This is also not working. May be i am doing something wrong. This code is working inside a tab. Please have a look. This is for showing posts..

    <?php
    // Include WordPress
    define('WP_USE_THEMES', false);
    require_once('../../../../../wp-load.php');
    // Show Posts
    $args = array(
    	'post_type'      => 'post',
    	'posts_per_page' => '6',
    );
    $post_type = new WP_Query( $args );
    if ( $post_type->have_posts() ) {
    	?>
    	<h2>Posts using WP_Query</h2>
    	<?php
    	while ( $post_type->have_posts() ) : $post_type->the_post();
    	?>
    		<article style="padding:0;" class="post type-post entry" itemscope="itemscope" itemtype="http://schema.org/BlogPosting">
    			<header class="entry-header">
    	                	<a style="display:block;margin-bottom:10px;" href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>">
    	                		<?php if ( has_post_thumbnail() ) { the_post_thumbnail('large'); } ?>
    	                	</a>
    	                	<h2 class="entry-title" itemprop="headline"><a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>">
    			        	<a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>">
    						<?php the_title(); ?>
    					</a>
    				</h2>
    			</header>
    			<div class="entry-content" itemprop="text">
    				<?php the_excerpt(); ?>
    				<a class="more-link" href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>">[Read more...]</a>
    			</div>
    	        </article>
    	<?php
    	endwhile;
    } // if
    wp_reset_postdata();

    I don’t know how to modify this code to fit my group data inside it. Can you please give me an example. Thanks

  • Hi @jazibzaman

    I don’t know which tab plugin did you use and how to use it, so I’m sorry I can’t test it out. Here is my testing code in data.php:

    <?php
    // Include WordPress
    define('WP_USE_THEMES', false);
    require_once('../../../../../wp-load.php');
    
    if ( isset($_GET['postid']) ){
        $post_id = $_GET['postid'];
        $fields = get_fields($post_id);
        echo "<pre>";
        print_r($fields);
        echo "</pre>";
    }
    ?>

    To test it out, you need to open this URL:

    http://example.com/wp-content/themes/your_theme_dir/includes/tabs/data.php?postid=99

    Where “example.com” is your domain, “your_theme_dir” is the directory where you put your current theme and “99” is the post ID that has the custom fields.

    It should show the fields in that post. So, the only thing you need to do is passing the post ID in the tab link.

    I hope this makes sense.

  • Hi @james, It’s working now. Thanks a lot for making it work. The last issue how to pass the post id using variable in the tab url

    I tried this but not working.

              <li><a href="<?php echo get_stylesheet_directory_uri(); ?>/includes/tabs/data.php?postid=<?php echo $post->ID ?>" class="tab">Data</a></li>
    

    Any idea how can i achieve this.

  • Hi @jazibzaman

    It depends on how your tab script works. In this case, could you please ask the tab script/plugin author about it?

    Thanks!

  • Hi @James, There is not a plugin but copied from a tutorial. Tabs are working via AJAX.

    Thanks

  • Hi @jazibzaman

    Could you please share the tutorial link so I can check it out? But I can’t promise that I can help you with this. The best way would be asking the tutorial author about it.

    Thanks!

  • This reply has been marked as private.
  • Hi @jazibzaman

    It seems that the tutorial uses jQuery tab feature to contain the content. I believe jQuery tab has a different way to pass the data. I’m not sure if this link is related, but please take a look at it: https://forum.jquery.com/topic/passing-post-parameters-to-a-remote-tab.

    For further support, could you please ask the jQuery’s support or community?

    Thanks!

  • I tried but still unable to get the desired results. This is very advanced for me especially jquery.

  • Hi @jazibzaman

    I’m sorry to hear that you’re still having this issue.

    I’m afraid I can’t help you either. Because it’s an issue relating to jQuery, your best shot would be asking their community. You can also hire a developer to help you out with it, and I’d recommend looking for one on https://studio.envato.com/ or https://www.upwork.com/. I’m sorry for the inconvenience.

    I hope this makes sense 🙂

  • Hi James, I got it working with the GET variable.

    Here is my data.php code.

    <?php
        require_once($_SERVER['DOCUMENT_ROOT'] . '/wp-load.php');
        $post_ID = $_GET['id'];
    
        $custom = get_post_custom($post_ID);
    
        foreach ($custom as $key => $value) {
            if (($key != '_edit_lock' && $key != '_edit_last'))
                echo '<tr><td>' . $key . '</td><td>' . $value[0] . '</td></tr>';
        }
    ?>

    Can you please explain me a little more that how can i add single custom field using the_field after closing php tags like that

    <?php
        require_once($_SERVER['DOCUMENT_ROOT'] . '/wp-load.php');
        $post_ID = $_GET['id'];
    
        $custom = get_post_custom($post_ID);
    
        foreach ($custom as $key => $value) {
            if (($key != '_edit_lock' && $key != '_edit_last'))
                echo '<tr><td>' . $key . '</td><td>' . $value[0] . '</td></tr>';
        }
    ?>
                        <span class="aps-1co"> <?php the_field('device_type'); ?> </span>
                        <span class="aps-1co"> <?php the_field('data1'); ?> </span>
    

    Do i need a closing php tags again? because the_field is not working and the upper php section is working.

  • Hi @jazibzaman

    The the_field() function needs the post ID for the second parameter if you call it outside of The Loop. So, it should be something like this:

    <span class="aps-1co"> <?php the_field('device_type', $post_ID); ?> </span>

    Also, you only need the PHP closing tag after a PHP code. So, in your case, I believe you don’t need it.

    I hope this helps 🙂

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

The topic ‘Displaying a group outside WordPress Loop’ is closed to new replies.