WordPress plugin intelligence profile

NP Twig: Front End for Custom Field & ACF

NP Twig Front End for WordPress Custom Field and Advance Custom Fields. Renders data using a twig template. It supports both free ACF and ACF pro.

WP PlugIndex snapshot

Current directory snapshot

Tested up to WordPress 5.7
Current version1.0.5
WordPress coverageTested up to WordPress 5.7
Minimum stackWP 5.0 · PHP 7.0
Directory statusactive
Last directory update4 Jun 20215y ago
Active installationsNewAdoption metric — not a quality score
WordPress.org ratingNo WordPress.org ratings yet
Official packageDirect from WordPress.org

Repository metrics are context, not quality scores. Active installations measure adoption and can strongly reflect a plugin’s age and historical popularity. Ratings, recent updates and “Tested up to” metadata also do not guarantee modern code, error-free operation, security, feature completeness or suitability for a particular site. Why active installs don’t tell the whole story →

WP PlugIndex currently records NP Twig: Front End for Custom Field & ACF version 1.0.5 as active, updated 5y ago and tested up to WordPress 5.7.

Overview

About this plugin

  • I use Twig template to display your post or custom post or Advanced Custom Fields
  • Twig and ACF are a third-party plugin, we used them to render templates

Arabic Version of this Article

  • https://www.miniindustry.com/d/ar-np-twig

Template requirements

  • Ensure installs of Timber plugin: https://wordpress.org/plugins/timber-library/
  • Then create a private post or page or of any post type
  • For custom post type template ensures that your template name looks like: tpl-{{post_type}}
  • or add a custom field to your post name it twig and store the template name inside it

Custom Fields and ACF

  • WordPress supports custom fields, and you could add them directly to your post,
  • and ACF plugin gives more power to the custom fields
  • Use the Advanced Custom Fields plugin to take full control of your WordPress edit screens & custom field data.
  • Read more about ACF on https://wordpress.org/plugins/advanced-custom-fields/

Template Syntax: a quick guide for WordPress Front End for Custom Field

Note: WordPress Classic Editor is preferred to edit templates

Comments

  • Use {# comments #} for comments, and comments will not render to the user,

Variables output

Variables in templets are post title, post object, and custom fields. To output post title you can use {{ title }}. If your post has a custom field called price.

We use {{ price }} to output the price. bar }}

Conditional output

The if statement in Twig check if a variable has a value or an expression evaluates to true We can add conditions to display any text. Let’s say that we have a custom field named “agent” and want to display a text when the field agent contains a text. We can write

{% if agent %} We have an agent in your area Our agent: {{ agent }} {% endif %}

another example; let’s say that we have a field named price. We want to display a text if the price is zero

{% if price == 0 %} <p>This product is free</p> {% endif %}

Please note that we use the operator == to check the equality You can also test if an array is not empty:

{% if meanings %} <p>The array or repeater field **meaning** contains some values</p> {% endif %}

Closing condition block

Always use {% endif %} to close the previous if condition, Read more about if keyword in twig

Repeater field and arrays

If our field or variable is an array or a repeater field we can loop over each item in a sequence using for keyword

The for statement code example

meaning }} {% endfor %}

The for statement format

  • We use {% for m in meanings %} to loop over an array or repeater field called meanings using m to mention for each row
  • Inside the loop starts the subfields or array items with the variable name **m.**
  • Always close the loop use {% endfor %}
  • Read more about the for keyword in twig

Important notes for templates code

  • In WordPress classic editor show source and ensure there are no tags inside the template code; ex {% <del><span></del> endfor <del></span></del> %}
  • For more details, see: https://twig.symfony.com/doc/2.x/

Power templating with only 4 keyword

Using if, endif, for and endfor allows to generate a powerful template; however, twig contains many other useful keywords to see other keyword and how to use them visit twig documentation

Short template example

example }} {% endif %} {% endfor %}

Output post data

We can access the post using the post keyword. content to access post content

title }}

content }}

read more about accessing post content on timber documents

Why templating engine and not a raw PHP programming language

  • More Simple; so templating is more readable, and very easy that allows users to learn quickly,
  • and Limit the allowed function to prevent bad mistakes,
  • and easy to edit using WordPress classic editor

About Twig templating engine

  • The twig template engine process templates data, and output a webpage.
  • and it is a flexible, fast, and secure template engine for PHP.
  • We use Twig a template language, and we allow users to modify the template design.
  • It is fast because Twig compiles templates into optimized PHP code.
  • Get flexible, so it allows the developer to define its own custom tags and filters.
  • Read more about Twig

Timber and Twig

  • Timber helps to include Twig in WordPress,
  • with Timber, you write your HTML using the Twig Template Engine separate from your PHP files,
  • and this cleans up your template code so, for example, and your Twig template can focus on the HTML and display.

License and use

This plugin is distributed in the hope that it will be useful, but without any warranty. See the GNU General Public License for more details. org/licenses/.

For Developers

Add custom data to fields

  • Edit the file user-functions.php
  • Create a function and name it get_fields_{{post_type}}
  • If your custom post type contains ‘-‘ replace it with ‘_’
  • I include a sample function in user-functions.php
  • Backup your functions, and keep in mind that the file user-function may be replaced on upgrade

Add custom data for each singular page

  • Edit the file user-functions.php
  • then create a function and name it np_content_singular
  • I include a sample function in user-functions.php
  • Backup your functions, and keep in mind that the file user-function may be replaced on upgrade
WordPress.org metadata

Plugin tags

Topics listed for this plugin in the WordPress.org directory.

  • custom fields
  • fron end
  • acf
  • display
  • timber
Compatibility & maintenance

Compatibility & maintenance

Tested up to WordPress 5.7

Not yet marked as tested with WordPress 7.1. WordPress.org currently lists Tested up to 5.7.

Current WordPress releaseWordPress 7.1
WordPress.org Tested up to5.7
Minimum requirementsWordPress 5.0 · PHP 7.0
Update activity4 Jun 20215y ago

“Tested up to” is directory metadata supplied by the plugin author. WP PlugIndex does not turn an older declaration into a claim that the plugin is incompatible.

Changes recorded by WP PlugIndex

Recent tracked changes

No tracked version or compatibility changes have been recorded by WP PlugIndex yet.

Tracking & source

WP PlugIndex tracks public WordPress.org directory metadata and records selected version, compatibility and availability changes as they are detected.

Plugin watchlist

Watch this plugin

Sign in to your WP PlugIndex account or create a free account. Free accounts can watch up to 5 plugins and see what changed.

Watch limit

Watchlist limit reached

You have reached your current active watch limit.