[Shortcodes in Sage] Example for FAQs #sage #blade #shortcodes #partials

faqs.blade.php

///////////////////////////
// /resources/views/partials/shortcodes/faqs.blade.php
<ul class="accordion span12" data-allow-all-closed="true" data-deep-link="true" data-deep-link-smudge="true" data-deep-link-smudge-delay="600" data-accordion id="deeplinked-accordion-with-smudge">
@foreach($faqs as $faq)
  <li class="accordion-item" data-accordion-item>
    <a href="#{{ $category }}{{ $loop->iteration }}" class="accordion-title">{!! $faq->post_title !!}</a>
    <div class="accordion-content" data-tab-content id="answer{{ $loop->iteration }}">
      {!! $faq->post_content !!}
    </div>
  </li>
@endforeach
</ul>

functions.php

// add "shortcodes" to file array_map in resources/functions.php

array_map(function ($file) use ($sage_error) {
    $file = "../app/{$file}.php";
    if (!locate_template($file, true, true)) {
        $sage_error(sprintf(__('Error locating <code>%s</code> for inclusion.', 'sage'), $file), 'File not found');
    }
}, ['helpers', 'setup', 'filters', 'admin', 'shortcodes']);

shortcodes.php

<?php
namespace App;

/**
 * Add the shortcodes
 * optional can add to app/setup.php instead of creating app/shortcodes.php
 */
add_action('init', function () {
    add_shortcode('faqs', function ($atts, $content = null) {

        // Extract the shortcode attributes
        $atts = shortcode_atts(array(
          'category' => 'general',
        ), $atts);

        ob_start(); // Start object caching or output

        // Set the template we're going to use for the Shortcode
        $template = 'partials/shortcodes/faqs';

        // WP_Query arguments
        $args = array(
          'post_type'      => array('faq'),
          'numberposts'    => -1,
          'posts_per_page' => -1,
          'cache_results'  => true,
          'order'          => 'ASC',
          'tax_query' => array(
            array(
              'taxonomy'    => 'faq_category',
              'field'       => 'slug',
              'terms'       => $atts['category'],
            ),
          ),
        );

        // Set up template data
        $data = collect(get_body_class())->reduce(function ($data, $class) use ($template) {
            return apply_filters("sage/template/{$class}/data", $data, $template);
        }, []);

        // Get the term, by slug, and append it to the data array
        $data['faqs'] = get_posts($args);
        // print_r($data['faqs']);
        $data['category'] = $atts['category'];

        // Echo the shortcode blade template
        echo Template($template, $data);

        return ob_get_clean(); // Return cached object
    });
    
    // add_shortcode('next-shortcode', function ($atts, $content = null) {
    // });
});

I was trying to use this code to create my shortcodes but I was stuck because it didn't worked until I found the answer, so I think I will write what I did to help if someone else needs it. I'm using Sage 10.

This is my app/shorcodes.php

<?php
namespace App;
use function Roots\view;

/**
 * Add the shortcodes
 * optional can add to app/setup.php instead of creating app/shortcodes.php
 */
add_action('init', function () {
    add_shortcode('related-picks', function ($atts, $content = null) {
        // Set the template we're going to use for the Shortcode
        $template = 'partials/shortcodes/related-picks';
        // Set the arguments for the template
        $args = [
            'title' => 'Related Picks.',
            'content' => null,
        ];
        return view( $template, $args )->render(); 
    });
});

I hope this helps someone else.