UX Blocks Explained - Flatsome Theme Tutorial

[@bradycaverly5794]

This is the finest Flatsome tutorial I have ever seen!

[@alexandersorbas1881]

So glad you have this channel !!!

[@Sebdelaweb]

Glad you enjoy it!

[@jeremyv2040]

Have yourself a drink man. Nice job. Appreciate the time, effort & "wantingness" to do these videos.

[@getunlit9519]

Amazing videos!! What a gem! So so happy you are doing these on Flatsome; it is a necessity for us "Woo" loyalists who refuse to switch over to Shopify- super valuable!

[@carterangon]

AWESOME Tutorials Seb, love ❤️ your work! You are an ARTIST 🤗

[@398700]

Excellent tutorial Seb! Your explanation of the UX blocks within custom footers was just what I was looking for!

[@user-kk4bq7mb8u]

Just wanted to let you know I appreciated your help and share of knowledge!

[@felipejaramillog]

Muchísimas gracias Seb. Keep up the amazing work!

[@adrianatroiano7982]

Hi, 👋 thanks for your video. I have a question, how can I do to customize header for the cart page, checkout page and account page? I create an ux block for each pages but how can I set it on these pages? If you have made videos or guides for this could you please send them to me? thanks

[@Sebdelaweb]

Thank you for your kind words! To customize the header for the cart, checkout, and account pages using UX Blocks, you can create a separate UX Block for each page and assign them through the Flatsome theme options or by applying custom CSS. If a direct setting is available in the theme options, you can easily select the block for each page; otherwise, custom CSS might be required. While we don't currently have a video covering this specific process, we truly appreciate your suggestion. However, it doesn't fully align with our current content strategy. Thanks again for watching!

[@adrianatroiano7982]

@@Sebdelaweb thanks for the answer, I create the Ux block for each pages. Where are the flatsome theme option to assign these block to woocommerce pages? Can you upload an image of it?

[@Sebdelaweb]

@@adrianatroiano7982 It’s good to hear you’ve got the UX blocks set up. To assign them to WooCommerce pages, head over to the Flatsome Theme Options. From there, go to WooCommerce > Shop or Product Pages, depending on where you want to place the blocks. If things don’t go as planned, it might be worth checking out the WooCommerce support forums or groups-someone there might have a helpful screenshot or two. Hope this helps!

[@webagewebdesign2114]

Hello, Using UX Blocks is very useful, but I've noticed that it generates errors from an SEO point of view.

[@Sebdelaweb]

Thanks for pointing this out. We got more feedback like this. Good to let the Flatsome Team know.

[@trantuyen9549]

Awesome tutorials. Hopefully you will create more tutorials like that, especially for Woocommerce.

[@babaad2732]

amazing tutorial, big thank

[@Sebdelaweb]

Glad you liked it

[@sincerelystone9878]

Amazing video! THANK YOU!

[@catarapatara6511]

I just subscribed. Maaaan you are awesome. Appreciated. What would be awesome is definetly woocommerce based pages. They really need re design. Look forward to it

[@babaad2732]

merci, force à tu offres un réel contenu de qualité, bien expliqué

[@Sebdelaweb]

Merci beaucoup, chérie

[@Rochas007]

Esta informacion vale ORO! me siento muy bendecido! MUCHAS GRACIAS!

[@breizhpress9755]

I must say, UX Blocks is an outstanding page builder that makes Flatsome a great theme. Flexible and fast. The only theme I know that comes close is the Kadence theme with their great Gutenberg blocks. I work with both. Both have their unique design possibilities. For instance, I love the sticky section option and the parallax effect for columns with Flatsome. And the way hooks are brilliantly handled with Kadence. Depending on design needs, I use one or the other. I suspect Kadence got its famous header builder inspiration from Flatsome, as it is the exact same tool. They applied the same principles to create a footer builder, I'd love to see that in Flatsome.

[@RhondaClark56]

Hi, I hope you see this! I added a block for a review on one of my product pages, but its showing up on all my product pages, which I don't want because its not relevant to the other product pages. When I delete the ux block, it causes one of my product pages to be deleted! I'm beyond frustrated. Any advice? Thank you.

[@sfashion2528]

Thanks. great tutorial

[@albertrivera712]

Thank youSeb

[@Sebdelaweb]

You are welcome

[@jcastrow3]

Super Super Useful Thanks

[@stephentremp327]

Thanks this is a concise and informative video very helpful!

[@ihorkit]

hi Sebastian, what tool do you use to record sceencasts?

[@lorenzorotasperti]

Awesome video! How can I create a menu with icons to insert on the page that can be scrolled horizontally? like the Apple menu at the top for selecting smartphones. A tutorial on this would be exceptional!

[@0Turbox]

I have added one of your footers, but the newsletter doesn't work.

[@yonesym5865]

very good. thank you.

[@joanmatsuitravelwriter8778]

I had a developer years ago who designed a custom block for a slider on my Flatsome art website. I am trying to remove that slider and I need to know how to do this. I want to redesign the landing page and add a slider but not where she placed it. Suggestions?

[@Sebdelaweb]

Thank you for your question! To remove the custom slider block, you'll need to access the WordPress dashboard and navigate to the page editor for your landing page. Look for the custom block in the page content and delete it. If it was added via a widget or custom code in the theme files, you might need to go to Appearance > Widgets or edit the theme files via Appearance > Theme Editor to remove the slider code. Once removed, you can add a new slider in your desired location using the Flatsome page builder or any slider plugin you prefer. Hope it helps! :)

[@SamuelLimawan]

Awesome. Thanks

thanks so much

[@papuu9111]

Great video. Need you help with a problem. I am using Flatsome and woo latest versions. Its a Shoe selling site with variable sizes. If i create custom attribute, then it wont let customer to select variable option on product page. If I use universal attribute then it shows "product image" instead of size number.

[@carlosfigueroa9287]

Hi Seb I did a light box using a UX block and everything work okay until I put the short code of the form. The form field are not aligned correctly. Any idea?

[@papuu9111]

hi. great video. I have a problem. i am using flatsome. in edit mode it shows' footer and let me customize normally. but footer doesn't show in live view.

[@joseokurut]

Hello, i just wanted to know if I can use Flatsome to build any website besides only woocommerce websites

[@marketabelickova2261]

Thank you so much for this video!! :)

[@CariocaSniper]

How to create a different Sidebar in woocommerce for categories in flatsome theme?

[@mohsenahmadi3491]

very very goooooooooooooood

[@johnlbuhril8759]

Hi, Is possible to create side banner in flatsome? by theway Awesome video.

[@ddrci88]

Can we make a stick buy button on product page ?

[@BetCazador]

Nice video Seb. It would be breat a video explaining and showing possible fixes for the "loading..." problem while using UX Builder... Is quite annoying and in Flatsome group they always reply to clear cache and deactivate plugins but I did that many many times and it doesn't fix the problem... Also tried with different web browsers and even in Incognito mode but the problem persists, it doesn't load the elements inside UX Builder while creating/editing. Thanks.

[@justart9938]

Thank you very much for your tremendous efforts in providing valuable information. Can you explain how to design an online store through flatsome studio in a more simple way please, greetings

[@CAFEWITHYOUNG]

So, now when we use BLOCK for designing the entire product page, it won't cause any issues with SEO. Google can understand it because there's nothing on the product page; it's pulling information from the BLOCK, kind of like a redirect.

[@Sebdelaweb]

Correct

[@kimani3597]

Hello seb, I just discovered your channel today. Amazing job you're doing here. Wondering if you could help me with a slider problem. I used ux builder to create a slider which looks good on the computer but has a large white space below it on mobile. None of the solutions on Google are working. If you, or anyone else who's seeing this, can help, I'd greatly appreciate it. Thank you

[@MrTheKanjo]

Ux block or image at mobile hompage?

[@reklessevilkid]

Hey Seb. I messed up on something simple. I created a block and forget to change the url slug and I pressed update. I actually wanted to rename the slug to a certain keyword for a discount lead magnet. How can I perform a 301 redirect on a block so I can fix that 404 block. Thanks.

[@Sebdelaweb]

If you insert UX Shortcode with the ID instead of the name it should always work. You can find the ID of your UX Block here: tppr.me/8bT40 ... So in this case I use this: [block id="3341"] instead of [block id="access-pass-bottom-content"]

[@kostadinnikolov240]

big thanks

[@nathalieschmid5253]

How can i custom create woocommerce checkout page with Flatesome / UX Builder?

[@reklessevilkid]

I am interested in creating a block and making a sign up form within that block. My goal is to create a 20% lead magnet where people can exchange their emails for the discount. can this be done thank you

[@Sebdelaweb]

Hi Ruben! Yes you can use the UX Blocks and then insert your contact form shortcode. I do this also all the time.

[@evagrab6039]

Hello, i am struggling with creating a new custom widget... As i need one extra sidebar... But the only tutorial i found is by using widget areas which i do not have in my admin wp... 😖

[@ctpact]

flatsome have some problems with new google web vitals metrics. The team must try to optimise the theme for that or they will lost some current users... and new wp 5.5 is around the corner

[@user-kk4bq7mb8u]

What do you mean?

[@Emanuel-jr2ii]

Hi Seb, I hope you are doing well. I haven't seen you posting as much as you used to do. Do you have any suggestions on how to change the default Woocommerce/Wordpress password requirements. Right now, the default says every password must be at least 12 characters long with strict requirements. In my opinion, that's absurd. I have switched sites and can really see the difference in new users registers. I don't know how to fix this. I have tried the plugin from Daniel Santoro , but I don't think it works properly with Flatsome.

[@fernandodacruz87]

does new video new flatsome 3.13.0 ? please

[@amiralbatal]

thank you

[@newhottrend4059]

wee need new more tutorial for flatsome customization the same work that u provide your clients website that on your portfolio.

[@ImranSiddqi]

Hello brother please make a video on woo sales badge 👍 thanks advance

[@mohammadrezaghanbari9679]

it was awesome, but i need more education to customize category and sub-categories pages. for example add pictures for sidebar product categories

[@renatasouto4190]

Hi Seb! Thanks for your videos! I have included a Newsletter Lightbox on the header of my site using Flatsome Shortcodes. As seen here prnt.sc/tub8rd the “Sign up for newsletter” tip is opening in a weird place, as my header is narrow. It’s also weird on mobile devices. Maybe you can show how to remove it? (only the black box dialog, not the SUBSCRIBE itself) Thank you!

[@JamielovesJesus]

Awesome video but UX Blocks destroy your SEO! Google tries to crawl them separately, so that content becomes visible in Google results - and you will see search console warnings about indexing etc - basically a no-no for SEO. You do not want your Footer to appear on it's own as a Google search result do you?

[@Sebdelaweb]

Thanks for your feedback! You're right-if UX Blocks aren't set up properly, they can cause some SEO issues. But with the right settings, like using "noindex" for things like footers or applying structured data to guide Google, you can avoid those problems. Keeping an eye on how Google crawls your site and adjusting as needed is key to maintaining solid SEO.

[@JamielovesJesus]

UX Blocks destroy your SEO!

[@Sebdelaweb]

Thank you for bringing this up! With the Yoast plugin, you can adjust the settings for each UX Block as needed. If you disable this option, those specific UX Blocks won't be indexed by search engines or appear in XML sitemaps. This gives you control over which content search engines see, so you can use UX Blocks without hurting your site's SEO. Hope this helps!