How do I create a wp gallery and use it in Frontity?

🙋Get Help
1

How do I create a wp gallery, expose it to the rest api and use it in the frontity app? I don’t get it.

4

Hi @mh123 ,

Frontity works mostly with data available through the REST API. But Frontity can also deal with the HTML generated by WordPress for a specific page/post.

So, I can think of two main approaches to create a WP Gallery and then using it with Frontity.

By using the data directly from the REST API

This approach would require to have an endpoint available with the images or gallery used in a specific post. There are several plugins that allow to create galleries and then insert them in posts via shortcodes.

The challenge.with this approach is getting an endpoint where the we can access the URL of the images attached to a specific post

Something like this

The solution in this case would vary depending on the plugin used for the images

By parsing the HTML and extracting the images

A more generic solution (and recommended solution) is using Frontity processors. They will allow you to parse specific pieces of code to extract the data so it can be used in a custom way.

For example, a native gallery of images in Gutemberg is renderered by wrapping the HTML code in a figure with a wp-block-gallery class

<figure class="wp-block-gallery">
   ...
</figure>

With this information, you could create a processor to process the HTML, extracting the URL’s of the images from that piece of HTML and return a React Gallery version (maybe using react-spring )

To know more about processors you have a look at our docs

You can also have a look at this video where we (DevRel team) explain how to create a custom processor and how it works

Hope this helps

1 Like