Loop

This article is for AMP Theme Framework users.

About this Component

Loop Component is responsible to render the data on home, archive, search pages.

How to use:

The following are the steps to use this component.

step 1:

To initiate the support for this component in your theme just add the following code to the functions.php of the theme files.

//Loop
add_amp_theme_support('AMP-loop');

This was the back-end part where we’ve just initiated, now to make it appear in the front-end follow the next step.

step 2:

To add the Loop in home, archive, search pages we need to call it where we want to display it.
example: add the following code in index.php, archive.php,search.php of the theme files.

 <?php amp_loop_template(); ?>

with this, you’ll be able to set loop on your theme.

step 3:

Now create loop.php to get loop contents on pages. In this page you can show the posts list details with pagination. follow these steps to add the required content in loop.php

step 3-I:

To start loop

 <?php while(amp_loop('start')): ?>

To end loop

 <?php endwhile; amp_loop('end');  ?>

step 3-II:

Inside the loop, you can show different contents of the loop according to your needs like:
Show image of post

 <?php amp_loop_image();  ?>

Show title of post

 <?php amp_loop_title();  ?>

Show excerpt(Short description) of post

 <?php amp_loop_excerpt();  ?>

Show Categories of post

 <?php amp_loop_category();  ?>

Show posted date of post

 <?php amp_loop_date();  ?>

Show permalinks in the loop of post

If you want the permalinks in the loop for adding read more text etc then with the help of our amp_loop_the_permalink function you can add it easily like:

By using this function you will display the permalink for the loop

<?php amp_loop_the_permalink();?>

By using this function you will retrieve the full permalink for the loop. This function only gets the permalink from loop but it will not display you need to add echo for displaying. 

<?php echo amp_loop_get_permalink(); ?>

Brief structure of loop.php

<?php while(amp_loop('start')): ?>
    <?php amp_loop_image(); ?>
    <?php amp_loop_title(); ?>
    <?php amp_loop_excerpt(); ?>
    <?php amp_loop_category(); ?>
    <?php amp_loop_date(); ?>
<?php endwhile; amp_loop('end');  ?>


Step 4

To Start the pagination( which will add next page and previous page links )

 <?php amp_pagination(); ?>

Step 5

If you want to modify the loop and divide it into post categories

array(
    'post_type' => 'post',
    'tax_query' => array(
    'relation' => 'AND',
        array(
            'taxonomy' => 'category',
            'field'    => 'term_id',
            'terms'    => 83, // category ID
        ),
         
    ),
) ))): ?>

That’s it for this tutorial!

We hope it helped you. If you have any feedback or questions, then please share them in the comments section below.