Advanced Views Docs
Live PlaygroundDownload PluginGet PRO
  • πŸ’‘Help Centre
  • ⚑Getting Started
    • Introduction
      • Key Aspects
      • Creating Your First View
      • Creating Your First Card
      • Plugin Terms
      • Plugin Interface
        • Field Options
    • Installation
      • Advanced Views Lite
      • Advanced Views Pro
      • Comparison Table
      • Upgrading from Lite to Pro
    • Supported data vendors
    • Starter theme
  • 🌟Display Content
    • WordPress
      • Post
      • Taxonomy terms
      • User
      • Comments
      • Menus
    • WooCommerce Product
    • Meta fields
      • Basic fields
        • Number
      • Content fields
        • Image
        • File
        • WYSIWYG
        • oEmbed
        • Gallery
      • Choice fields
        • Select/checkbox/radio
        • True / False
      • Relationship fields
        • Link
        • Post_object
        • Page Link
        • Relationship
        • Taxonomy
        • User
      • Advanced fields
        • Google Map
        • Google Map Multiple Markers
        • ACF OpenStreetMap Field
        • Date/time picker
      • Layout fields
        • Group (Pro)
        • Repeater (Pro)
        • Flexible (Pro)
    • Object fields
    • Custom Data (Pro)
    • Custom Gutenberg Blocks (Pro)
    • Mount Points (Pro)
    • Front-end assets management (Pro)
  • πŸ¦Έβ€β™‚οΈQuery Content
    • Basic Filters
    • Meta Filters (Pro)
      • Current Post
      • Comparison
      • Dynamic Injection
    • Taxonomy Filters (Pro)
    • Pagination (Pro)
    • Custom Data (Pro)
  • πŸ†Shortcode Attributes
    • Common Arguments
    • View Shortcode
    • Card Shortcode
  • πŸ§™β€β™‚οΈTemplates
    • Customizing the Template
    • Template engines
      • Twig
      • Blade
    • CSS & JS
      • BEM Methodology
      • WordPress Interactivity API
    • File system storage
    • Pre-built components
    • Reusable components library (Pro)
    • Live reload
    • Multilingual
    • Custom Ajax & Rest API (Pro)
  • β˜•Guides
    • Display Custom Post Type (CPT) on another post
    • Display Employees (CPT) of a Company (CPT)
    • Display Nested Repeater Fields
    • Map Marker from ACF Image
    • Display all CPT items on a single map
  • πŸ› οΈTools
    • Export/Import
    • Demo Import
    • Settings
    • Preview
  • 🏹Troubleshooting
    • Compatibility
    • Report a bug
    • Payment Issues
    • Lite Support (Forum)
    • Pro Support
  • βš™οΈCustomization
    • Filters and Hooks
      • View
      • Card
    • Suggest a feature
    • Performance
Powered by GitBook
On this page
  • How to use it
  • 'Image' link
  • On-page link content preview
  • FAQs

Was this helpful?

  1. Display Content
  2. Meta fields
  3. Relationship fields

Link

PreviousRelationship fieldsNextPost_object

Last updated 8 months ago

Was this helpful?

The Link field type (e.g. ) allows a link to be selected or defined (url, title, target) by using the native WordPress link popup.

How to use it

Select the Link field from the Field list. You can add a label as a prefix and a Link Label to replace the default label.

'Image' link

You can wrap any image into the link. This well-known technique provides a visual representation, allowing readers to click on the image to open a specified URL.

Make sure both image and link fields are added to the target View, and amend the template to put the img tag inside the a tag, as shown below:

{% if link.value and image.value %}
    <a target="{{ link.target }}"
       href="{{ link.value }}">
        <img src="{{ image.value }}" width="{{ image.width }}" height="{{ image.height }}" alt="{{ image.alt }}" decoding="{{ image.decoding }}" loading="{{ image.loading }}" srcset="{{ image.srcset }}" sizes="{{ image.sizes }}">
    </a>
{% endif %}

On-page link content preview

<iframe src="{{ link.value }}" width="100%" height="600px"></iframe>

FAQs

How do I make my links open in a new tab?

Use the "Open in New Tab" setting in the Field Options tab for more control with links.

Use a Relational field to 'link' two Custom Post Types (CPT) together. Combine it with a to display related content.

Whether the link field points out on the external or internal URL, you can display it directly on the page using the :

🌟
Meta Filter
(Pro)
<iframe> element
ACF Link field