WPLake

@onlinetexasltc Could you please share a link to your page?
I can then provide you with the exact CSS you need.

We’re marking this question as resolved, because there’s been no reply.
Feel free to write, and we’ll assist further.

Hi @onlinetexasltc

You can display two ACF fields inline by using CSS.

Add the following into your ACF View > Advanced tab > CSS Code

/* replace the class as needed */
#view__row {
display: flex;
}

Let me know if that works.

Hi @kkeach

I’m sorry that I was perhaps not so clear with my explanation.

When you create an ACF View and you’ve got your fields assigned, these fields are wrapped in classes, for example “acf-view__row”, “acf-view__field” and so forth. It’s the “acf-view__row” which is important in your case.

Try replacing it with the below CSS.

#view__row {
display: flex;
}

If that doesn’t work, could you provide a link to the page where you have your ACF View?

At the moment, you’ve defined a style for “div, span” which would apply to other elements on the same page as the View, which yields unexpected results, as you’ve mentioned.

Hi @kkeach

Thanks for choosing ACF Views!
To display the label and the field value on the same line you could use CSS.
Try adding the following style rule in the ‘Advanced->CSS Code’ field;

display: flex;

Hi @ahmedhassan8112

Thank you for the kind words, we’re glad you like ACF Views.

Let’s see how we can solve your issue.

When you create new fields, is this within ACF or do you mean when assigning the fields in your ACF View?

Hi @cartmr

We’re only replying here for completeness of the ticket.

The problem you’ve experienced was due to your cache plugin minifying the CSS.

To display the taxonomy, with a text prefix inline with it’s value in Elementor, you could add the “display: flex;” CSS style for your div or class.

Hi @cartmr

So do you have an ACF Views Pro license?
If so, please reach out to us via our support form.

With regards to your questions.
a) you could hide the link with css. or you could customize the output of your View with filters.

b) it’s likely due to some conflict, or cache or even compiled css. You could test by adding ‘!important’ to your defined style. e.g. “font-weight: bold!important;”.

I am not sure why your CSS wouldn’t be recognized.

Perhaps you could share a link to the page?
Or provide temporary login access to your website via our support form?

Regards

Hi @laksacurry

We’re glad to hear it’s all working well.

To have the “Featured image with link”, you’d need to please update your ACF Views plugin to the latest version.

Hi @laksacurry

What you’d need to do is create an ACF View, we’ll call this View “archive item” in there you’d assign from Group $post, “Title with link”, and “Featured image with link” fields, with a small image size. Publish the View. (No need to copy shortcode here)

Then create an ACF Card, we’ll call it “archive grid”, assign your “archive item” View. Use filters as necessary, for e.g. so it shows “gallery archive CTP” post types items. Publish and copy the first shortcode, go to your “Galleries overview” page (the page that should show all archive items). Use the Gutenberg shortcode block or paste directly into the content. Publish the page.

For the Gallery page/post (gallery single) we’ll also create an ACF View, let’s call it “archive details” and then you can again assign the fields “Title”, “Featured image” with image size large (no need for links as we’ll be on the page) and keep adding all the other fields that need to be displayed. Save and copy the shortcode, paste it on the “gallery” page/post to test (but it would be worth while putting the shortcode in your theme’s template file). Fill the fields from your “archive item”. Save that and view the post to see the result. Remember to add some more gallery page/post items at this stage, if there aren’t any.

Visit the Gallery overview page and it should show the gallery single item, or more if there are available. Clicking on either the title or image would go to the details page.

Let me know if that works.

• This reply was modified 1 year, 4 months ago by WPLake.

Hi @dotnetdiva

Unfortunately the code you provided wouldn’t work, as it has syntax errors.

Please see below for a code snippet. You can use that as a base. See the “fixme” comment lines in the file, where you’d need to replace it with your values.

Kindly note that in the Database, only the value of the selected choice is stored (from the field settings). So, if your button?group has the selected choice as ‘base: Base’, you’ll need to compare exactly with ‘base’, but not with ‘Base’.

<?php

// fixme use your field name in the quotes instead of 'base_game'
$baseName = $_fields['base_game'] ?? '';

$baseDescription = '';

switch ($baseName) {
    // fixme use your target value in the quotes
    case 'base':
        // fixme use your target label in the quotes
        $baseDescription = 'Expansion';
        break;
}

return [
    'baseDescription' => $baseDescription,
];

Not a problem @carlbtmn

Thank you, I think I understand better now.

You’d need to create an ACF Card and assign your View. There are Sort and Filters available.

Please see our docs for more details.

Let me know if that helps.

Hi @carlbtmn

Only official ACF fields are currently supported.

Do you mean, you’re using ACF Views already but have an issue with same value for all? If so, try putting the shortcode in the post/page template.

• This reply was modified 1 year, 4 months ago by WPLake.
• This reply was modified 1 year, 4 months ago by WPLake. Reason: Clarity

Hi @justcarl,

The task isn’t ordinary, so you’ll need to use some of our filters.
I can suggest the following solution:

• Add the $Post$ ‘Title’ field to your View (at the very top)
• Add the following code to your theme, that will do the trick, and replace the file’s name with the current post title

class FileWithPostTitle
{
    private string $currentPostTitle = '';

    public function __construct()
    {
        // fixme use your view id instead of '5'
        add_filter('acf_views/view/field_markup/view_id=5', [$this, 'maybeModifyMarkup',], 10, 4);
    }

    /**
     * @param \org\wplake\acf_views\AcfView\FieldMetaInterface $fieldMeta
     */
    public function maybeModifyMarkup($fieldHTML, $fieldMeta, $fieldValue, $viewId): string
    {
        $name = $fieldMeta->getName();

        switch ($name) {
            case '_post_title':
                $this->currentPostTitle = $fieldValue;
                $fieldHTML = '';
                break;
            // fixme use your file field name instead of 'file'
            case 'file':
                // 1. replace the current link label with the stub
                $fieldHTML = preg_replace('/(<a[^>]+>)([^<]+)(<\/a>)/', '$1_title_$3', $fieldHTML);
                // 2. replace the stub with the current post title
                $fieldHTML = str_replace('_title_', $this->currentPostTitle, $fieldHTML);
                break;
        }

        return $fieldHTML;
    }
}

new FileWithPostTitle();

Don’t forget to replace the values to yours (see fixme comments).

Best regards.