Wow, you already switched to the footer builder? Awesome, that was fast!

So the CSS would look like this:

@media only screen and (max-width: 767px) {
     #footer-builder * { text-align: left !important; }
}

By targeting via the asterisk we make sure anything in the footer will be left-aligned no matter the module settings or inline edits.

- AJ

Thanks a bunch. Yes I figured I do it now instead of getting sidetracked! Much appreciated!

Great. Just let me know if you need anything else!

- AJ

Hi,

To be honest I’m not sure what you are referring to when it comes to the section elements. What labels do you require to add to the page builder elements? These shouldn’t need any landmarks.

Now…in terms of adding landmarks to builder modules that’s going to be pretty complex. I can help figure something out, but it doesn’t seem like they actually need any. Can you explain what modules and what landmarks do you need adding?

- AJ

Hello AJ,

This is new for me too. The system being used to scan the website is Site Improve (siteimprove.com) and the accessibility “error” that I am referring to is that pages have multiple sections, which do not have unique ‘aria-label’ or ‘aria-labelledby’

The homepagina (just as any other page on the website) is build with different sections (the element from the page builder).

If it’s easier to create a ticket let me know. I can then also share the report with you that Site Improve gives me.

If I can see the report that would be very helpful, when you submit a ticket though request that it be assigned to me though as this is something I’ll need to look at.

Now, the University of Hawaii actually uses Total so I’ve worked with them closely to make sure the theme is Accessible and there aren’t any issues (in fact they are the reason I added the Accessibility panel and theme aria landmarks). They haven’t mentioned anything before about the “sections” and they have basically a full team working on Accessibility so maybe it’s something I can ask them about as well as they know a lot about this stuff.

- AJ

Hi,

This is AJ the theme author.

• The first error is a bit obvious as it says it’s coming from Akismet. It may need an update or it has a bug.

• The other errors are most likely coming from a plugin. Usually “Headers already sent” errors can be caused by a few things but from what I’ve found they are often caused by blank spaces at the top of files. They are definitely not coming from the theme though. I would recommend disabling all your plugins 1 by 1 to see which may be causing the issue.

The errors could potentially be coming from a child theme as well if you are using one so if deactivating plugins doesn’t help you may want to test switching to the parent Total theme instead of a child theme if you are using one.

- AJ

Yes the issue is that very recently I’ve been editing some variable products and changing category and this was then strangely causing the gray out of stock badge to appear on the cat archive page – even though the product is in stock and ‘stock management’ is turned off in the Woo settings. Viewing the product single detail page the product is fine and does not display the badge.

I was then trying all sorts of things to get the badge to disappear … and then finding out that the Quick Edit / Stock Status wouldn’t save – so the product was remaining as being Out Of Stock (when the Quick Edit detail is viewed).

I then Googled this and found some other people had this issue and found the snippet of sql to reset the stock status globally, so was resorting to doing this in phpmyadmin…. I then used the CSS style to display:none.

A client of mine who has another Total site at spadaclothing.co.uk actually called me to say this was happening on their site too – so that’s when I thought there was some upgrade bug or something.

Anyway, I’ve just tried to recreate the issue by removing CSS display:none and editing some product .. and now I can’t make the badge appear!... Its no biggie really as the CSS solves the issue .. it is likely there is some conflict somewhere – I just thought I’d ask to find out if this is known or happened to anyone else etc. Thanks for your advice and the css. Cheers, Chris.

Hi Chris,

Yes, this a function in the total theme only for entries so it won’t display on the products themselves.

Sounds like a WooCommerce bug when stock management is disabled the product still returns true for the in stock check.

Well, I guess maybe it’s not a WooCommerce bug it’s potentially done on purpose for some reason.

So what I’m going to do is add an extra check inside the theme so if stock management is disabled in WooCommerce settings the Out of Stock will not get added period no matter what the individual product settings are.

The fix is simple….

Edit the file at Total/framework/core-functions.php and locate the wpex_woo_product_instock function which currently looks like this:

function wpex_woo_product_instock() {
    global $product;
    if ( ! $product || ( $product && $product->is_in_stock() ) ) {
        return true;
    }
}

Change to:

function wpex_woo_product_instock() {
    if ( 'yes' === get_option( 'woocommerce_manage_stock' ) ) {
        global $product;
        if ( ! $product || ( $product && $product->is_in_stock() ) ) {
            return true;
        }
        return false;
    }
    return true; // always true if manage stock is disabled
}

This will be added in the upcoming update also.

Thanks for reporting the bug!

- AJ

Awesome, thanks for this.

Great! Keep me posted on any issues or pending questions!

How do i do the masonry layout for woocomerce? Thanks

Ok I wrote a little snippet for you: https://wpexplorer-themes.com/total/snippets/apply-masonry-layout-to-woocommerce-shop/

Now this will only work with the updated Total 4.9 – https://wpexplorer-themes.com/total/changelog/

I tested the snippet working and it works well for me the only other thing is it would be a good idea to also add this CSS to your site:

ul.products { clear:both; }

This will prevent issues with the masonry layout if you are using the WooCommerce sorting select. I will actually add this CSS in the next theme update as well inside the main theme’s woocommerce stylesheet.

- AJ

The menu was fixed by unchecking and rechecking some setting either in the theme panel or the customizer, not sure.

I emptied the cache, browser cache and also disabled wp cache plugin. I also tried a different browser that has no browser plugins at all. I made all updates to the plugins (WP Bakery and Slider Rev.) I also checked the browser console.

So: all seems fine. I did not change anything except deactivating a wp plugin that makes the site avail. only to logged in users in order to publish the site. There was a short mixup with which domain was the domain the site runs on but in the end the domain is still the licenced domain and the licence seems fine as well.

I also deactivated most wp plugins even though they all played well together so far,

Wow, the issue resolved itself all by itself today. My guess is that it had to do with the short mixup with the domains. Thanks for your replies

Oh awesome! I am so glad to hear that!! If you do need anything though please let me know. I’m here to help.

- AJ

Hi,

I just replied to your last comment with the same sort of question. Basically, there isn’t any current way of doing this. It would be possible to override a custom category (taxonomy) with a WPBakery template but only via a child theme edit. The issue you are going to have though is when you override the template there isn’t currently a method for displaying your archive items on the page.

What are you trying to modify exactly on these archives?

- AJ

thanks your tips were very helpful – Next issue that I encountered was that on active the main menu is no longer bold. How can that be fixed. New theme is here: http://newsite.galmed.s424.sureserver.com/ and the old theme with the look we want to keep is https://galmedpharma.com/ I also see that the icons for social media are missing – I noted something in the changelog about that. And will review. Thanks again

Hi,

• The bold on the menu is also related to what I mentioned regarding link styles having to be added to the inner link span. So you have this custom CSS:

#site-navigation .dropdown-menu >.current-menu-item > a,
#site-navigation .dropdown-menu >.current-menu-parent > a {
    font-weight: 400; 
}

Simply change to:

#site-navigation .dropdown-menu >.current-menu-item >a .link-inner,
#site-navigation .dropdown-menu >.current-menu-parent > a .link-inner {
    font-weight: 400;
}

Making the change on the current live site would work also.

• For the social icons. You are using images and the links are broken, they are missing the / before wp-content : https://cl.ly/0da92f

Is it possible you did a search/replace on the new server for your domain name and accidentally removed the backslash?

- AJ

thanks. Yes – the search and replace got confused. The icons may end up working fine on the live site.

Hi,

This is AJ the theme author. Technically you can add an unlimited number of items to the carousel – E.g: https://cl.ly/14c891

If you are being limited to 10 items this is a server limit. Can you try adding more then 10 images and then view your server error logs? If you are being limited it should place a new error message in there and than we’ll be able to know where the limitation is coming from so I can help you fix it.

- AJ

Thank you for the reply!!! I just switched to classic editor and manually added the image id to the end of the array of (10) images in between the code. It works like a charm. Thank you!!!!!

That does work also

Hi,

I’m glad you like the theme. Yes, I don’t really like Bootstrap because it’s a massive CSS framework so it slows down loading times. I find it best to add only the CSS needed for the site.

For the Contact Form. If you use the Total “Form Shortcode” module it will convert the select dropdown into a custom design to match the theme fields (and that can be re-styled with custom CSS if needed) like this: https://cl.ly/c2d404

If you have any other questions, issues or suggestions for theme improvements let me know!

- AJ

ps: Your VueJS Admin template is really nice, good work!

Thank You

Sure thing, if you need anything else just let me know!

Do you think it would be helpful to add an option under Theme Panel > Custom CSS to disable the CSS editor if you wanted to just have a simple text block for your custom css? E.g: https://cl.ly/08129a

Thanks for considering this but I dont think I would like this. Auto Complete and Suggestions are to good to give up.

Thanks for the feedback

Hi Thanks for your answer. Yeah, it makes sense, I can use Ticons family in the css. No problem about the update, I should read the changelog more carefully

If you have any other issues, questions or suggestions for future updates (some Total updates coming soon). Let me know!

- AJ

Ok! Thanks for your help AJ

Hi AJ,

I didn’t have the same syntax to display the icon, and it actually looks fine in the customizer till I publish and refresh the front end – https://style960.com/total/

Thanks, Paul.

Hi Paul,

What’s happening is that the plugin is adding the P tags automatically -

P tags display as blocks so you need to add some CSS to your site make them display inline. Example:

#top-bar-content .ticon { margin-right: 10px; }
#top-bar-content p { display: inline-block; }

- AJ

Yeah sorted now, thanks for your help

Hi,

Not sure what you mean by “can not skip the crop module” when you upload a custom logo there is no cropping. WordPress only adds a “cropping” function for the “Header Image” which is not the same as the logo. Is that what you are referring to?

- AJ

Sorry for the lack of infos;

Site icon customize/site identity/upload image/.

Everytime I upload I am prompt for cropping the image. can t go through it as I want to use a SVG.

Regards,

Oh yes, WordPress doesn’t allow SVG for the site-icon because SVG’s can’t be cropped via WordPress cropping functions and the Site Icon needs to be resized for all the different site icon sizes needed. In fact I wouldn’t recommend it either for security reasons. SVG’s are technically not even allowed to be uploaded to WordPress without some “hacking”.

While you can use a filter to manually define your SVG site icon via a child theme (I can provide the code if you want) I would highly recommend using a png or jpeg for your site icon and doing it through the Customizer.

- AJ

ps: I believe chrome doesn’t yet support SVG site icons either.

Hi there,

Right now when I look at the page I’m not seeing a hover box but a simple image. The issue you mention though sounds like the map is being set as a background and backgrounds aren’t “responsive” per-se. In general though I wouldn’t recommend the hover box (SEO, usability, responsiveness…etc).

I think it’s fairly clear right now that you can click on the map since the cursor changes to a pointer but if you want to make it more obvious instead of a hover box putting a tiny line of text under it that says “click” to view map” would actually make people click on it before they even hover and be more useful.

Of if you use the Total image module instead of the WPBakery Single Image module you could use one of the overlay styles – https://cl.ly/ce0d16 (or even create a custom overlay style via a child theme if wanted)

- AJ

Thanks, AJ.

After I left my message, I decided to use the single image box as a place-holder until I heard from you. And now that I’ve set it up, I may just leave it like this. It’s more obvious now than it was with the hover box.

I appreciate your response! Knowing you don’t recommend the hover box makes up my mind. (But I’ll probably check out the Total image module to see if I like my options there better.)

Once again, thanks for the great support. I’ve lost track of how many sites I’ve built with your theme, and I still love it!

No problem, just let me know if you need anything else, otherwise have an amazing weekend!

- AJ

ps: Thank you for your continued support/purchases and I welcome any suggestions you have for upcoming updates

Hi again, I hope you’ve been doing well, haven’t seen you in a while

1. The best way to insert items into the mobile menu is via javascript since the mobile menus are created dynamically with javascript to prevent having the WordPress menu function from loading twice in the HTML by default which isn’t ideal for SEO or speed.

So if your search already exists on the page you can clone the element and insert into the mobile menu. If it doesn’t exist on the page you need to add the html to the page via an action hook and hide it with CSS then move it with javascript.

Now, since you area using the Sidebar mobile menu, this mobile menu actually does have a function that allows you to add/remove elements. Here is a sample snippet: https://wpexplorer-themes.com/total/snippets/sidr-source/

Another sample snippet: https://wpexplorer-themes.com/total/snippets/sidr-menu-widgets/

2. Total uses a woocomerce.php file which overrides any sort of archive-product.php file. If you want to override the main shop you would place a woocommerce.php file in your child theme.

But it’s 100% unnecessary to modify ANY template files. If you want to change the main shop it’s best to do so using action hooks – https://wpexplorer-themes.com/total/docs/action-hooks/ – if you tell me what you want to change I can help with that.

3. I don’t have plans to add a vertical style for the shop thumbnails but it’s not hard to do with some CSS. I see you already added some CSS for the shop vertical thumbnails, but as you can see the issue is that fi you have a lot of items it stacks vertically which looks very bad – https://hicab.demosayt.ml/product/qisa-yeni-gupurlu-bone/ – you would have to use javascript to basically convert the thumbnails into a carousel.

- AJ

ps: Your site is looking great!!!

Ultimate Addons is free in the plugin directory – https://wordpress.org/plugins/ultimate-addons-for-gutenberg/

If you try removing the top or bottom margin on a shape divider block for example, it’s not removed. That will work with Twenty Nineteen.

As long as TinyMCE is maintained I guess. Plan this year is to convert all widgets into blocks and leave a single remaining ‘classic widget’. Menus are to become blocks too. GB is becoming more than something used to edit pages.

Hi,

I downloaded the plugin to test but I don’t see the Shape Divider, is this part of a “Pro” version? If so if you let the plugin developers know about the issue they can look into it for you and if it is a theme problem you can have them email me directly at wpexplorer [at ] gmail [dot] com and I’d be happy to fix any potential compatibility issues (most likely just a CSS conflict). This way I don’t have to purchase their product just to test. Thanks!

- AJ

ps: I’m sure if Gutenberg continues to grow and actually becomes popular, big plugins like WPBakery will most likely be updated to have a more “seamless” integration providing their modules as G-blocks as well.

Oh shoot, the correct classname is “wpex-select-wrap” not “wpex-select-wrapper”.

But (I forgot about this). Instead of using the classname you could also use the Total Form Shortcode module to insert your contact form on the page it will replace the select automatically without needing the custom classname.

- AJ

That is perfect, thank you!

Your welcome, sorry it took so long! If you need anything else let me know, otherwise have a great weekend!

- AJ

Hi,

This is AJ the theme author.

So this theme was actually released with the original FontAwesome script which was later updated to a 5.0 version and it changed drastically. Because the script changed so much and we couldn’t update as it would cause issues with current customers, instead I renamed the script to “Ticons” (total icons). So the icon names available are the ones found here: https://fontawesome.com/v4.7.0/icons/

And if you are manually adding icons you need to do so with this format:

<span class="ticon ticon-phone" />

But a better method is using the shortcodes for manual implementation: https://wpexplorer-themes.com/total/docs/font-awesome-shortcode/ – which can be added anywhere (even a template file if needed via do_shortcode).

If you did want to use FontAwesome 5 it’s very easy to load via a child theme or you can use a little plugin to load it.

- AJ

Thank you sir!!! I will do and if I have a question I will get back to you!!! thank you!!

No problem, I’m here to help so if you need anything at all, let me know! Otherwise have a fantastic weekend.