I had an issue with the LinkedIn post inspector displaying the words footer-text within the snippet. It turns out that the og:title was not respected at LinkedIn. The problem was WordPress itself - not LinkedIn.

Disable the WP Rest API, and you are good to go. The contents of the oembed+json link that is embedded in the wp_head() creates the issue with the "title" being set to "id".

I achieved this by installing the Disable WP Rest API plugin for WordPress. This solved the problem and Linkedin displayed the posts as expected.

<?php
wp_nav_menu( array(
    'menu_class' => 'kt-nav main-menu clone-main-menu',
    'container' => '',
    'items_wrap' => '<ul class="%2$s">%3$s</ul>'
) );
?>

<?php

// Define custom query parameters
$custom_query_args = array(
    /* Parameters go here */
    'posts_per_page' => 12,
    'post_type' => 'video_production',
);

// Get current page and append to custom query parameters array
$custom_query_args['paged'] = get_query_var( 'paged' ) ? get_query_var( 'paged' ) : 1;

// Instantiate custom query
$custom_query = new WP_Query( $custom_query_args );

// Pagination fix
$temp_query = $wp_query;
$wp_query   = NULL;
$wp_query   = $custom_query;

// Output custom query loop
if ( $custom_query->have_posts() ) :
    while ( $custom_query->have_posts() ) :
        $custom_query->the_post(); ?>

    Do stuff here

<?php
    endwhile;
endif;
// Reset postdata
wp_reset_postdata();

// Custom query loop pagination
previous_posts_link( 'Older Posts' );
next_posts_link( 'Newer Posts', $custom_query->max_num_pages );

// Reset main query object
$wp_query = NULL;
$wp_query = $temp_query;

 ?>

Place this in your theme’s functions.php file.

/*-------------------------------------
  Move Yoast to the Bottom
---------------------------------------*/
function yoasttobottom() {
    return 'low';
}
add_filter( 'wpseo_metabox_prio', 'yoasttobottom');

<?php
$terms = get_the_terms( get_the_ID(), 'bake-lovers-categories' );
if ($terms) {
    foreach($terms as $term) {
        echo '<span class="tag">'.$term->name . ' '.'</span>';
    }
}
?>

    
<?php
$aust1 = types_render_field("available-in-australia", array("option"=>0));
if ($aust1) {
    echo 'woolies';
}
$aust2 = types_render_field("available-in-australia", array("option"=>1));
if ($aust2) {
    echo 'coles';
}
$aust3 = types_render_field("available-in-australia", array("option"=>2));
if ($aust3) {
    echo 'other';
}
?>

This is happening because the parent theme is calling in styles.css using enque.

Disable it by adding the following into the child themes functions file:

/* -- Removes the parent theme stylesheet,
to stop it being called twioce (Foundation CSS was being called after style.css)
-- */
function PREFIX_remove_scripts() {
    wp_dequeue_style( 'screen' );
    wp_deregister_style( 'screen' );

    wp_dequeue_script( 'site' );
    wp_deregister_script( 'site' );

    // Now register your styles and scripts here
}
add_action( 'wp_enqueue_scripts', 'PREFIX_remove_scripts', 20 );
/* -- Removes the parent theme stylesheet END -- */

As a freelancer there hasn't been too much need for me to use Git - But all that's about to change. I'm jumping into the deep end, and documentaing my journey. here we go:

Here's an excellent overview of what we will be doing. It includes links to two developers solutions:
https://premium.wpmudev.org/blog/git-for-wordpress-development/

The first solution detailed in the above blog post is quick linked here:
https://premium.wpmudev.org/blog/improve-wordpress-development-workflow-local-server/

Wordpress Desktop Server

It suggests using Wordpress Desktop server to create a local environment. I'm already used to using wamp and mamp - but in order to follow the instructions in the blog post I decided to give Desktop Server a shot.

I was successfull in creating a new local wordpress environment, although importing an existing website into Desktop Server has proved to be a pain. The frontend and backend are displaying PHP warnings, and the wordpress login isn't displaying at all.

<?php
$counter = 0;
$Accordion_heading_1 = get_field('Accordion_heading_1');
?>

<section id="accordion-1" class="accordion">
    <div class="container">
        <?php if ($Accordion_heading_1) { ?>
            <h2><?php echo $Accordion_heading_1; ?></h2>
        <?php } ?>
        <div class="accordion" id="accordionexample">

            <?php

            // check if the repeater field has rows of data
            if (have_rows('tab_1')):

                // loop through the rows of data
                while (have_rows('tab_1')) : the_row(); ?>

                    <?php
                    $counter++;
                    ?>

                    <div class="card">
                        <div class="card-header" id="heading<?php echo '-' . $counter; ?>">
                            <h2 class="mb-0">
                                <button class="btn btn-link" type="button" data-toggle="collapse"
                                        data-target="#collapse<?php echo '-' . $counter; ?>" aria-expanded="true"
                                        aria-controls="collapse<?php echo '-' . $counter; ?>">
                                    <?php the_sub_field('question'); ?>
                                </button>
                            </h2>
                        </div>

                        <div id="collapse<?php echo '-' . $counter; ?>" class="collapse"
                             aria-labelledby="heading<?php echo '-' . $counter; ?>" data-parent="#accordionexample">
                            <div class="card-body">
                                <?php the_sub_field('answer'); ?>
                            </div>
                        </div>
                    </div>

                <?php endwhile;

            else :

                // no rows found

            endif;

            ?>

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

See the Pen Dynamic bootstrap 4 carousel using wordpress advanced custom fields by shannon briggs (@shandb) on CodePen.