Hi,

For security reasons the theme uses what’s called as a nonce in WordPress – https://developer.wordpress.org/apis/security/nonces/ – this nonce is generated based on the Post Card settings (shortcode attributes) and added to the grid like this – https://a.cl.ly/P8uoDvKb

When sending the AJAX, which is done with javascript, the theme uses this nonce to validate that the request is coming from your site and that there aren’t any extra or different parameters sent with the request. For example if your grid is set to display portfolio items, someone can’t just make an arbitrary request for posts from a different post type.

This helps prevent potential abuse and/or malicious requests.

Now, in WordPress these nonces last 12-24hrs. This means, if your page HTML is being cached for longer than the nonce will no longer validate. Any page where you are using the theme’s Post Card’s AJAX (filter, load more, ajax search) will need to have their cache set to clear every 12hrs so the nonce is properly refreshed on the frontend.

If you are referring to the option “Render with AJAX” – this is intended to help with some caching issues if your site uses longer caching times, but they still need to be under 12hrs.

I personally use WPEngine for my hosting, which has built-in full page cache and it refreshes every 10 minutes other popular hosting solutions like Pressable clear every 5 minutes. As long as you have a good server, there isn’t much need to cache your pages for very long because they should be able to re-build very quickly.

Looking at the plugin you mentioned – https://wordpress.org/plugins/cache-enabler/#description – it appears their very first option is so you can set an Expiration. You can try using 12, but it may be best to use 11 to be extra safe.

- AJ

Hi,

This is AJ the theme author.

Total Theme Core 1.7.1 is very old and you would only get this error if your theme is also very very outdated and it’s trying to download a version of the plugin that no longer exists.

You’ll want to first update your theme, then you can update the Total Theme Core plugin and bundled plugins like WPBakery and Slider Revolution to the latest version included in the theme: https://totalwptheme.com/docs/changelog

Since your site is very outdated I recommend you follow the extra precaution steps when updating the theme as noted on the docs: https://totalwptheme.com/docs/update-theme/#h-extra-precautions-for-cautious-users-or-extremely-outdated-installations

If you run into any issues or need help updating your theme let me know. Once it’s updated, I highly recommend updating your site whenever a new version is released so you site doesn’t get so outdated.

Revslider Note: There is a newer version of RevSlider that’s not yet included in their theme because their last massive update had many bugs so I was waiting to ship it once it’s more stable. But also, I am considering no longer bundling the plugin with the theme for new installations for various reasons including: the plugin is no longer sold on CodeCanyon and they have changed their licensing drastically, the plugin keeps getting more and more bloated and can really slow down sites, generally sliders are not recommended for most sites, and you can create sliders with the theme if you really needed them using the new Carousel Container added in the latest version of the theme.

- AJ

Hi,

This is Aj the theme author.

I don’ have any examples, I will be releasing some new demos soon which will include Just Events! If you have a specific niche you would be interested in, let me know!

I had some demos using The Events Calendar, the problem is that plugin kept updating and introducing new bugs and it became a real hassle to keep those demos up to date and working correctly. This is actually why I created my own Just Events plugin.

That said, I do have an article for my Just Events plugin explaining how to set everything up with some screenshots: https://totalwptheme.com/docs/just-events/ – the plugin is intended for sites that just need simple events and you can use the theme’s built-in functions like Custom Cards & Dynamic Templates so you can display the entries and single posts how you want.

Now, depending on your needs it may be worth using a 3rd party service instead for hosting the events. For example if you need to sell tickets, using a 3rd party service outside of WordPress is generally better for many reasons.

- AJ

Thanks AJ. I agree, The Events Calendar has caused me several headaches. That is why my clients is looking to move away from them. I am scheduled to rebuild the site on May 18, and I would like to show them what your plugin looks like on a website. I will keep an eye on your demos for examples. Can I import events created with TEC?

Hi,

No, there is no function to import TEC events. But it wouldn’t be hard to code up a little function you can run on your site which I can provide for you if needed.

My plugin is very minimal, so it’s really only intended to display lists of events or to be used with custom builds were you can extend the plugin to add the custom functionality you want. So there isn’t any advanced functionality such as a calendar view (yet, I do plan on adding that in the future) or locations. I created the plugin using SquareSpace as an example. Here are 2 sample SQ templates: https://ocotillo-fluid-demo.squarespace.com/ or https://roseti-fluid-demo.squarespace.com/events

Since you can create dynamic templates and custom cards with Total, you can really make the events look however you want so having specific examples may not be so useful. It would make more sense to figure out what the customer wants and then re-create it.

If you’d like to share a link to the current domain, perhaps I can share some better feedback on how I would recommend proceeding.

- AJ

Hi,

This is AJ the theme author.

I’m not quite sure what you are asking, can you share the URL in question for context?

If what you want is a transparent header so that you can have an image behind the header like this demo – https://totalwpthemedemo.com/biz/ – here are the docs for that: https://totalwptheme.com/docs/overlay-header/

Now, in terms of setting an elements background to “transparent” the way it’s done in the theme is using the Global color selector. Here is a video example showing how to set the default page header title background to transparent: https://a.cl.ly/QwuZjy1b (note, the color selector was recently updated so if your’s looks different, your theme is outdated).

- AJ

Hi,

I tested this and it’s working as expected for me. Here is a video of my test: https://a.cl.ly/6qulGG49

These are the only reasons I can think of for it not working:

• Your custom field isn’t an actual “date” field type, but rather a text field and you are adding dates using a format that isn’t compatible with WP_Query. I suspect this is most likely the cause because if the date is not properly formatted it will show all posts when using the < comparison due to how WordPress works internally.

• Your theme is outdated, there was a bug a few versions ago where the dynamic values such as “today” were not being parsed correctly in the Meta Query field.

• You are testing with a future date that is tomorrow and because of your installation’s timezone, it’s already tomorrow so it’s actually returning the correct results. Try with some dates farther in the future.

- AJ

ps: By the way, if you are wanting posts to stop showing once their day has passed, you will need to either exclude the page from caching or enable the “Render with AJAX” option in the Post Cards element (General Tab). Otherwise your server’s caching or caching plugin (all WordPress sites should be using some form of caching) will conflict.

Thanks AJ, actually you are right. It works: )

Sorry, for the confusion. I just built a plugin that creates an UI for your “WPEX_Meta_Factory” class. It seems there was an error in the date registration. Now I use plain php code for the date custom fields and it works

Hi,

I hope you had a nice weekend!

If you are using the Elementor Pro header builder, just like the theme’s header builder, you will want to create 2 different headers so you can assign the global one and then a different one for pages using the transparent header. Unfortunately, Elementor doesn’t allow you to set Conditionals based on a custom field so you will need to use custom code and hook into “elementor/theme/get_location_templates/template_id” to modify the header template based on your transparent header custom field.

Now, you could have a single header and show/hide logos using CSS based on if it’s a transparent header, but to me this will just bloat up the header having a bunch of elements that are intended only for certain cases, especially if you are also wanting to swap logos when the header is sticky (most likely needed for the transparent header). But more importantly, you will need to use a bunch of CSS to swap your header colors when it’s transparent.

Which by the way, if you aren’t using the theme’s Transparent header function and you are using your own custom field, you will need to hook into the body_class to insert a classname to your page when the transparent header is enabled so you can target the site with custom CSS.

Currently, the theme’s transparent header functionality doesn’t work with the Elementor Theme Builder and I’ve considered making it work, the problem is it could break people’s sites when updating if they had enabled it in the past but since it did nothing they don’t know it’s enabled. But, you can use the theme’s Header Builder instead with Elementor and the transparent header functionality will work as expected.

Now, if you are using the Elementor Pro theme builder, to make your header sticky you would edit the Header container and under the Advanced tab enable Motion Effects and set the Sticky position to Top: https://a.cl.ly/E0upZRLw

With the Total header builder you can use classes “visible-stuck” and “hidden-stuck” to show/hide elements inside the custom header, but these won’t in Elementor but you can add some CSS yourself for this:

.elementor-sticky:not(.elementor-sticky--active) .visible-stuck { display: none; }
.elementor-sticky.elementor-sticky--active .hidden-stuck { display: none; }

I will look into updating the theme’s visible-stuck and hidden-stuck classes in the next update to work with Elementor.

In terms of making the header shrink when it’s sticky you want to target the same ”.elementor-sticky.elementor-sticky—active” classname as the example above and there are so many ways to make the header “shrink” and it depends entirely on the design. If your header has padding, you can make the padding smaller when sticky, if it has a large logo you can make the logo smaller when sticky or you can do a combination of the two. Where things become a bit tricky is in making the shrink animation “smooth” as the browser may not animate it properly if not done right – for example if you just change the height of the logo, the outer header container won’t animate, just the logo.

The theme’s shrink sticky header animates by applying a default height to the header and changing the height once it’s stuck. You could apply a fixed height to your custom header as well if you want it to work like that, but having a fixed height can be tricky to deal with if you have any overflows.

By the way, since you are adding your own transparent header field for the affect, I’m not sure if the Elementor’s sticky motion effects will work if a header is placed in an absolute position by default.

The best thing may be for you to setup a simple example and then I can look and provide some feedback.

Also, perhaps you can convince the client agains having transparent headers as this is just a design feature that doesn’t necessarily add any real value to the website. It might be more important to the client to stay within budget and not pay you to spend a bunch of time on the transparent header implementation and/or focus on having an easier to manage site.

Another thing to consider, is that perhaps you don’t need a custom header. Maybe you can just tweak the default header a bit to work more how the client wants. I’ve seen many customers create custom headers to achieve things they could have done with one of the default header styles and just a couple lines of code.

- AJ

Hi,

There has never been an option for “Custom Footer” in the theme settings metabox, so I’m not sure what you are referring to.

Now, generally a website will have the same footer across the whole site, but if you want a specific page to have a different footer (maybe it’s a custom landing page) the easiest thing to do is to disable the footer and then just add a “footer” using the page builder directly on the page. Having to create a separate footer and then assign it to the page doesn’t make as much sense as just adding the content directly on the page.

Can you explain what you are trying to do, perhaps I can share the best solution?

I ask, because I have seen customers in the past manually changing those Theme Settings on a per-page basis for many pages, this creates a lock-in affect that makes it hard to change in the future across all those pages. The theme has hooks and filters so if you want to change how something works for a specific “section” (like a group of pages, posts, post types, etc) it’s possible via a little code or it may be best to actually add a custom post type and move these pages that should function/look different into their own post type and you can then control them easily – https://totalwptheme.com/docs/adding-custom-post-types/

- AJ

Hi Alice,

TL:DR – Add the classnames “wpex-relative wpex-z-2” to the image you want on top and “wpex-relative wpex-z-1” to the image you want behind.

The Image Element hasn’t ever had a z-index option, you can add a z-index using utility classes in the Extra classname field – https://totalwptheme.com/css-framework/z-index/

For z-index to take effect, the element must be positioned (not static). Typically you use position: relative or absolute, but other positioning values also work. So if you are using the z-index classes on the element or custom CSS you will need to also add the classname “wpex-relative” or if it’s custom CSS position: relative;

Inspecting your site I see you added the “wpex-z-1” classname to the second image. But the z-index doesn’t take effect, you can see this when inspecting using Chrome developer tools: https://a.cl.ly/o0ud7dKQ

So, you need to also add wpex-relative to give it a relative position.

Last, just adding a z-index to the second image won’t work either because the first image doesn’t have a z-index (unless you use a negative z-index but I don’t recommend it). You need to also give a z-index to the first image with the text and make it larger than the z-index on the second image, such as “wpex-relative wpex-z-2”

- AJ

Got it! Thanks so much as always for your awesome support!

Hi Connie,

I can’t recreate this issue locally or on my live test site and this element hasn’t been modified since Total 6.0. If you are seeing the HTML instead of the actual character most likely there is some plugin filtering out the code (like a minify HTML plugin).

That said, I will update the element to use literal characters in the next version which should work in all instances. If you are just trying to patch up a specific site you can edit the file at plugins/total-theme-core/inc/vcex/templates/vcex_post_meta.php and locate the switch statement on like 78 that looks like this:

switch ( $atts['separator'] ) {
    case 'dash':
        $separator = '–';
    break;
    case 'long_dash':
        $separator = '—';
    break;
    case 'dot':
        $separator = '·';
    break;
    case 'forward_slash':
        $separator = '/';
    break;
    case 'backslash':
        $separator = '\';
    break;
    case 'pipe':
        $separator = '|';
    break;
    default:
        $separator = '';
    break;
}

And change it to:

switch ( $atts['separator'] ) {
    case 'dash':
        $separator = '–';
    break;
    case 'long_dash':
        $separator = '—';
    break;
    case 'dot':
        $separator = '·';
    break;
    case 'forward_slash':
        $separator = '/';
    break;
    case 'backslash':
        $separator = '\\';
    break;
    case 'pipe':
        $separator = '|';
    break;
    default:
        $separator = '';
    break;
}

You can also just change the pipe value if that’s the only one you are using.

I do hope to release the next update within the next 1-2 days as well – https://totalwptheme.com/docs/upcoming-update-changelog/

- AJ

Hi AJ,

Hmm, weird. I don’t believe I have any minifying on the site. I’ve just gone ahead and changed the separator to a Dot, which is fine.

Thanks!

Connie

Hi Tony,

What is happening is that your site has the Transparent Header enabled and set to the White text color so your links are the same color as the background: https://totalwptheme.com/docs/overlay-header/

From what I can see it was enabled globally in the Customizer under Appearance > Customize > Header > Transparent Header. Simply toggle off the first option. This is intended for creating designs like this where you have a background under the header – https://totalwpthemedemo.com/biz/

- AJ

Thank you AJ – fixed!

Glad it was an easy fix

Hi,

It looks like when I added the Term Cards element I used some of the code from the Terms Grid and forgot to update the dependency which causes the Parent Terms Only option to now show up. I will fix this in the upcoming update – https://totalwptheme.com/docs/upcoming-update-changelog/

But if you want, it’s a very simple fix so you can tweak the file yourself and have access to the option immediately.

Edit the file at plugins/total-theme-core/inc/vcex/shortcodes/wpex_term_cards.php

Locate line 524 which looks like this:

'dependency' => [ 'element' => 'query_type', 'value' => [ 'custom', 'post_terms' ] ],

And simply change where it says ‘custom’ to just be ’’. Like this: https://a.cl.ly/KouXdBA7

The element is already coded to work with the setting, you just can’t see it in order to use because of the dependency (in the older Terms Grid the default Query Type is technically called “custom” but in the new Term Cards element the default Query Type is nothing so we need to check using an empty string in the dependency).

Thank you again for reporting the issue!

Let me know if you have any issues tweaking the code or any questions.

And regarding the ‘Term Card’ Query type in the Post Cards element is to allow you to display posts from the term when creating a custom card, see here: https://totalwptheme.com/docs/group-posts-by-taxonomy/ – TL;DR – you can create a card for the Term Cards element and insert the Post Cards element, then select “Term Card’ for the Query type to display posts from the currently shown term.

- AJ

Thanks for the heads up, I forgot to exclude this page when making some updates over the weekend so it’s actually parsing them into their values.

Fixing right now!

By the way, since the last update, in any theme element field as soon as you type {{ it will show a dropdown to select dynamic variables like this: https://a.cl.ly/L1uAN65v – and it is “smart” enough to filter so if you want the post title for example and you write {{post title it will show “Post Title” as the option in the dropdown so you can click it and it will replace what you wrote with the correct variable name.

Hey,

I hope you had a nice weekend.

Sorry for the inconvenience, I was making some updates to the docs and you must have looked at the exact time I was tweaking things.

I cleared the cache again though, just incase!

- AJ

Looks great! If there is any takeaway from my experience as Total Theme Customer, it is that AJ is always making it better(!), from the theme itself, to the docs, to the integrations and even complimentary plugins – thanks for always making it as good as it can be, AJ – keep it up!

Hi,

This is Aj the them author. I hope you had a nice weekend, thank you for your patience!

This demo doesn’t actually use any page builder, it’s just the default theme design since it’s a plain blog. What are you trying to change?

If you are trying to change the Homepage, the reason you can’t change anything is because it’s using the preset “Blog” template, see here: https://a.cl.ly/d5uqEm8Z – if you want a custom homepage, you would set the template to “Default”, then it will be a blank page that you can edit. I would recommend when creating a custom homepage to use the theme’s Post Cards element to display your recent posts, more info about this element here: https://totalwptheme.com/docs/total-theme-cards/

Now, for individual posts, it’s never recommended to use page builders like Elementor, WPBakery or other. Since your single posts only require basic text, images, headings it’s always best to use Gutenberg for the actual post content.

But, if you want to create a custom blog post design you can via what is called dynamic templates in the theme – https://totalwptheme.com/docs/dynamic-templates/ – Or if you own Elementor Pro, Total does support the Theme Builder – https://elementor.com/help/the-elementor-theme-builder/ – which will allow you to create a custom design for your blog posts, header, footer, etc. But again, you wouldn’t use Elementor on a single post basis, but you would use it to create the global design for all posts if you want a custom design.

Last, if you wanted to modify the default theme design you would start at Appearance > Customize. This is where you can alter the site widths, default colors, enable/disable elements, etc. I recommend if you haven’t gone here, to start here for tweaking the default theme design if wanted.

Let me know what you are trying to change exactly so I can assist.

- AJ

Hi,

I’m not able to recreate the issue myself.

Now, in the last update the theme changed to using a CSS variable for the background image (—wpex-site-header-bg-img) this change was needed to support the new gradient background.

If your image isn’t showing up, then your site is loading old CSS and is missing the new CSS variable. WordPress has built-in cache busting to prevent these sort of issues, however, if you are using 3rd party plugins to minify/combine your CSS or plugins/custom code that removes script version numbers then your site could be loading the old version of the theme’s CSS and so the header background image won’t work.

Be sure to purge any 3rd party CSS optimization and caching plugins.

You could also have cache-busting issues if you are using an incorrectly coded child theme.

If you can share the URL I can inspect the code and tell you exactly where the problem and tell you how to fix it so cache-busting is working properly to prevent issues with future updates.

- AJ

Hi,

This is Aj the theme author.

Thank you for your patience, I usually respond to all tickets within 48hrs but unfortunately I had an issue yesterday and couldn’t attend to the tickets. I am catching up and replying to all of them today. I’ll get this sorted out right now!

- AJ

Hi,

This is Aj the theme author. Unfortunately you can’t share screenshots here.

Checking my system I see you have 1 license and it’s registered to “www.consept.hr”. Is this the site in question?

You can always log in and manage your licenses here – https://my.totalwptheme.com/license-manager/ – so you can verify where your license is currently registered and make sure it matches your URL. If it doesn’t match the URL you can click the trash icon next to the license so you can then register it anywhere you need to.

- AJ

ps: It looks like the URL I mentioned above has some very strong caching via “wpfc-minified” and it’s loading old CSS so your site may have some display issues. Make sure to fully clear the plugin cache so it can re-build the minified CSS file with the updated theme CSS.

Hi,

I’m not having this issue when testing. I recorded a video test: https://a.cl.ly/YEu2dJWX

Can you share a sample page with the issue?

I do want to mention, that because of how WPBakery rows work, if you add a border it may not be perfectly inline with the rest of the site because WPBakery uses negative margins to offset innner column borders. When adding backgrounds, padding, borders, etc to rows that are NOT stretched it’s always best to use an Inner row as that inner row will be contained inside and not be affected by the negative offsets.

- AJ

ps: There is a known WPBakery bug with borders where it get reset each time you save the row, I’ve already reported this and they said the fix will be in the next update. You can always apply a border though using theme classes – https://totalwptheme.com/css-framework/?s=border – if you prefer as well (some customers prefer using classes instead of WPBakery as it doesn’t insert extra inline CSS). For example you can add the classes ‘wpex-border-2 wpex-border-solid’ which will add a 2px solid border, then you can just define the color in the Design Options tab.