Atte Liimatainen

<p>Converts frontend to JSON response when request is done with certain conditions.</p>
<h3>Inspiration</h3>
<p>After creating a bunch of headless WordPress + Web app stacks, I wanted to find a standard and a all-round solution for fetching per page information for web applications inside WordPress. Built-in rest api works fine in basic cases, but it doesn’t support querying by path. Usually this meant that for each project developers would create a custom rest endpoint which would return expected content using content type and slug parameters.</p>
<p>WordPress has few built-in functions to retrieve content by path, <a href="https://developer.wordpress.org/reference/functions/url_to_postid/" rel="nofollow ugc">url_to_postid</a> and <a href="https://developer.wordpress.org/reference/functions/get_page_by_path/" rel="nofollow ugc">get_page_by_path</a>, but they don’t seem to work with multilanguage plugins, taxonomy or archive pages, which means that WP doesn’t have a reliable way to fetch content this way through rest api.</p>
<p>This plugin converts frontend to JSON which seems after above solution the best way to do things, with added layer of security through application passwords (WordPress v5.6 feature) and a filter, which let’s developers alter outgoing data.</p>
<h3>How to start using the plugin</h3>
<ul>
<li>Install and activate this plugin in your environment</li>
<li>Create application password for a user with administrator role</li>
</ul>
<p>After above steps have been made, make a request to a page with added <a href="https://en.wikipedia.org/wiki/Basic_access_authentication#Client_side" rel="nofollow ugc">Authorization header</a>. See data fetching examples at the end of this documentation for more help</p>
<h3>Modifying the output</h3>
<p>Plugin outputs current page’s Post object or null. This can be modified using <code>headless-converter-modify-data</code>-filter. You can either modify passed in post object or do your own logic like in the example below.</p>
<pre><code>/**
 * Modifies Headless Converter plugin's output.
 * 
 * @param WPPost|null $post - Current template's post object 
 */
function modify_headless_converter_output($post) {
  if(is_404()) {
    return "this block renders 404 page content";
  } else if(is_page()) {
    return "this block renders page post types content";
  } else if (is_singular('post')) {
    return "this block renders single post content";
  } else if(is_home()) {
    return "this block renders post archive";
  } else {
    return $post;
  }
}

add_filter('headless-converter-modify-data', 'modify_headless_converter_output');
</code></pre>
<h3>Data fetching examples</h3>
<h4>Fetch</h4>
<pre><code>const username = "admin"
const password = "1111 1111 1111 1111 1111"
const url = "http://localhost:3000/?page_id=2"
const opts = {
  headers: {
     'Authorization': 'Basic ' + btoa(username + ":" + password) 
  }, 
}
fetch(url, opts).then(r => r.json()).then(console.log)
</code></pre>
<h4>Axios</h4>
<pre><code>const axios = require("axios")

const username = "admin"
const password = "1111 1111 1111 1111 1111"
const url = "http://localhost:3000/?page_id=2"
const opts = {
  auth: {
    username,
    password
  }
}

axios(url, opts).then(r => r.data).then(console.log)
</code></pre>


Headless Converter

Converts frontend to JSON response when request is done with certain conditions.

staticsnap

<p><strong>Static Snap</strong> is a powerful WordPress plugin that transforms your dynamic WordPress site into a static website, enabling seamless integration and deployment across various hosting services.</p>
<h3>Advantages of Using Static Snap</h3>
<ol>
<li>
<p>🛡️ <strong>Enhanced Security</strong>: By converting dynamic WordPress sites to static formats, Static Snap minimizes security risks associated with dynamic content and databases, significantly reducing susceptibility to hacking and malware attacks.</p>
</li>
<li>
<p>⚡ <strong>Increased Speed and Performance</strong>: Static sites generated by Static Snap load faster than dynamic sites since they are served directly from a CDN, eliminating server-side processing. This results in quicker access times, enhancing user experience and engagement.</p>
</li>
<li>
<p>💵 <strong>Reduced Hosting Costs</strong>: Static Snap allows the use of less resource-intensive hosting solutions, which can be cheaper or even free, significantly lowering overall website maintenance costs.</p>
</li>
<li>
<p>🔧 <strong>Simplified Maintenance</strong>: Users can manage their site content via WordPress while Static Snap serves a static version, blending ease of management with enhanced stability and reliability.</p>
</li>
<li>
<p>📈 <strong>SEO Benefits</strong>: With faster load times and increased reliability, static sites often rank better in search engine results. Static Snap maintains WordPress’s SEO capabilities while improving site performance.</p>
</li>
<li>
<p>⬆️  <strong>Scalability and Reliability</strong>: Static Snap ensures that static sites are more scalable and reliable under high traffic conditions, maintaining uptime and performance during peak times.</p>
</li>
<li>
<p>🔍 <strong>Preserved Functionality</strong>: Essential dynamic features, such as search and form capabilities, are retained in the static version of the site, ensuring no functional compromise with Static Snap.</p>
</li>
<li>
<p>🔁  <strong>Automated Backups to GitHub</strong>: Static Snap automatically pushes the static site to a connected GitHub account, providing robust version control and secure backups. This facilitates easy tracking of changes and reverting to previous versions.</p>
</li>
<li>
<p>🌳 <strong>Eco-friendly Hosting</strong>: By reducing server resource needs, Static Snap supports more sustainable hosting, aligning with eco-friendly practices.</p>
</li>
<li>
<p>📋  <strong>Content Management Efficiency</strong>: Users benefit from the familiar WordPress interface for content management while enjoying the performance advantages of a static site.</p>
</li>
</ol>
<h3>Contributing</h3>
<p>Contributions to the Static Snap plugin are welcome! Please read our contributing guidelines on our <a href="https://github.com/static-snap/static-snap" rel="nofollow ugc">GitHub repository</a> to get started.</p>
<h3>Third-Party Services</h3>
<p>This plugin utilizes third-party services to provide certain functionalities. Below is the information regarding the external services used:</p>
<h4>Static Snap API</h4>
<ul>
<li><strong>Description</strong>: This plugin communicates with the Static Snap API to manage certain operations related to the plugin’s functionality. This includes transmitting data such as user configurations and usage data.</li>
<li><strong>Circumstances of Use</strong>: The API is utilized only if the user chooses to enable additional functionality. These extra functionalities include integration with GitHub and the ability to save static forms using the API.</li>
<li><strong>API Link</strong>: <a href="https://api.staticsnap.com" rel="nofollow ugc">Static Snap API</a></li>
<li><strong>Terms of Service and Privacy Policy</strong>: <a href="https://staticsnap.com/terms-and-conditions" rel="nofollow ugc">Static Snap Terms of Service</a> | <a href="https://staticsnap.com/privacy-policy" rel="nofollow ugc">Static Snap Privacy Policy</a></li>
</ul>


Static Snap

Static Snap converts your WordPress site into a static website, boosting performance, security, scalability, and SEO.

Headless Converter vs Static Snap