Video

You can achieve this using a Data Store. First, ensure that the Data Store option is enabled in JetEngine. Create a new Data Store and name it 'Vote Count.' Select the 'Cookie' option, and very importantly, make sure the 'Count Items' option is also enabled. Next, use JetEngine’s Listing Grid to display the photos. In the listing, add a Data Store button that will record the number of clicks to the Data Store. you have the option for text befor clicking the button and after so for example Customize the button text to say 'Click to Vote' before it’s clicked and 'Unvote' after. When configuring the Data Store button, set the 'Action After an Item Has Been Added to the Store' option to 'Remove from Store.' This allows users to correct their vote if they click by mistake-clicking once adds their vote to the Data Store while clicking again removes it and undoes the vote. You can choose to display the vote count in the listing grid or use dynamic visibility to make the count visible only to the admin. Here's a video that demonstrates a similar system. czcams.com/video/VojIpSw5zdA/video.html

In the registration form I've created, there's an option to enable 'Login User After Registration,' so the form essentially acts as both a registration and a login form. The 'Remember Me' option should only appear if you enable this feature. When selected, it keeps users logged in for a longer period-14 days instead of the usual 2 days-without having to re-enter their credentials each time they visit the site.

did you change the container direction in mobile view? try using my template filenewcreate.com/vertical-scrolling-container-2/

The filter type is a checkbox with styling applied to it(makes it look like tabs). Here’s an article on how to filter WooCommerce products by attributes. crocoblock.com/knowledge-base/jetsmartfilters/jetsmartfilters-how-to-filter-woocommerce-products-by-attributes/

@@crocomentor no, actually what I asked was do you know a way to get the variation filters in a separate tab manner? (Each variation like a button) Instead of selecting from a dropdown or check in a checkbox.

use my template(just delete the version u dont want to use) filenewcreate.com/unfold-template/

it doesn't, only with Elementor

@@crocomentor thanks 🙏

did you give an id (to the field) and css class to the form?(watch the third version again) prnt.sc/uj3jbjShmGfZ prnt.sc/Aj_5XViJ1C6-

@@crocomentorthank you soo much, i skipped to the 4. part and missed that information 😅

Welcome to the channel! Thank you so much for the kind words! I'm glad you found the content useful. Elementor and Crocoblock are fantastic tools, and I’m happy to share tips on them.

Thanks a lot!

You can check out this page with the effect in action: filenewcreate.com/form-2-message-demo/. Give it a try and see if it works for you. If it does, it might indicate that something wasn't set up correctly in your case. You can also download my template and use it to ensure everything is set up properly.

try it on my page does it work for you? filenewcreate.com/form-2-message-demo/

watch this video czcams.com/video/bKcR-kIOSiA/video.html

It should work whether you are logged in or out. Ensure the page with these effects is not restricted to logged-in users only

@@crocomentor I understood why: there were "custom messages" turned on within Elementor form.

I was wrong, the bug persists event with "custom messages" turned off. 😕

try creating a brand new page and use my template see if it will work filenewcreate.com/form-2-message-demo/

I can't upload ("Invalid template type" message)

try this: filenewcreate.com/scroll-con-top/

Thank you for pointing that out. I understand the issue you're experiencing. It's a bit tricky to address, but you can try using the code below. This approach might still cause a minor jump; however, it will initially display a minimized version before transitioning to the closed state. Give it a try while I work on finding a more seamless solution. Here’s the code: <style> /* Initially hide the text editor */ .your-text-editor-selector { display: none; } </style> <script src="code.jquery.com/jquery-3.6.0.min.js"></script> <script> jQuery(document).ready(function($) { // Initial state var isExpanded = false; var $textEditor = $('.your-text-editor-selector'); // Ensure this is your actual selector var $button = $('.your-button-selector a'); // Ensure this is your actual button selector // Apply initial height restriction $textEditor.css({ 'max-height': '100px', 'overflow': 'hidden', 'position': 'relative' // Add relative positioning }); // Add gradient overlay pseudo-element $textEditor.prepend('<div class="gradient-overlay"></div>'); // Apply gradient overlay style $('.gradient-overlay').css({ 'position': 'absolute', 'top': '0', 'left': '0', 'width': '100%', 'height': '100%', 'background': 'linear-gradient(to top, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.7) 50%, transparent 100%)', 'pointer-events': 'none' // Allow clicks to pass through the overlay }); // Reveal the text editor after applying initial styles $textEditor.show(); // Button hover effect $button.hover( function() { $(this).css('cursor', 'pointer'); // Set cursor to pointer on hover }, function() { $(this).css('cursor', 'auto'); // Reset cursor to default when not hovering } ); // Button click action $button.click(function() { if (isExpanded) { // Collapse $('.gradient-overlay').show(); // Show the gradient overlay $textEditor.animate({maxHeight: '100px'}, 500); // Animate height change isExpanded = false; $button.text('read More'); // Optionally change button text } else { // Expand $('.gradient-overlay').hide(); // Hide the gradient overlay var fullHeight = $textEditor.prop('scrollHeight') + 'px'; $textEditor.animate({maxHeight: fullHeight}, 500); // Animate height change isExpanded = true; $button.text('read Less'); // Optionally change button text } }); }); </script>

try this: filenewcreate.com/scroll-con-top/

JetEngine is a plugin from Crocoblock. Just make sure it's installed on your computer crocoblock.com/plugins/jetengine/

yes its a taxonomy, check this video out: czcams.com/video/QvIQhFTr_aQ/video.html

it does work on my end, but here is the code: .scrollcon { max-height: 40vh; /* Set the maximum height of the container to 60% of the viewport height */ overflow-x: hidden;/* Prevent horizontal scrolling */ overflow-y: scroll;/* Enable vertical scrolling within the container when content exceeds its height */ border: 1px solid #ccc; /* Border style for the container */ border-radius: 10px; /* Applies a border-radius to the scrollbar track */ } .scrollcon::-webkit-scrollbar { width: 14px;/* Sets the width of the scrollbar */ } .scrollcon::-webkit-scrollbar-track { background: BLACK; /* Sets the background color of the scrollbar track */ border-radius: 10px; /* Applies a border-radius to the scrollbar track */ } .scrollcon::-webkit-scrollbar-thumb { background: blue; /* Sets the background color of the scrollbar thumb */ border-radius: 10px; /* Applies a border-radius to the scrollbar thumb */ }

Yeah, I see what you're saying. I'll make sure to fix that up in the future. In the meantime, here's another option you might like even better. Check out the CZcams video here:czcams.com/video/lOghzLiR73Q/video.html. Thanks for letting me know!

To fix the jump, delete the hashtag in the button link field. prnt.sc/nuyjSP2tdR7R

@@crocomentor It worked, thank you so much!

You're welcome!

@@crocomentor Hey another one - I use this to create a loop item, and then apply the taxonomy filter (example of options in the filter: All, A, B, C) When is on all that is default and the first one it works perfectly but when I select the option A at the filter does not work anymore (I make the hover version). The url changes when the filter it's applied. Dont know if that could be a problem.

Unfortunately, the unfold effect doesn't work well inside loops, but this is what you can try doing:elementor taxanomy filter doesnt have a reload option only ajax so You need to create a taxonomy filter with JetSmartFilters and set the apply type to 'reload'. Don't forget to toggle on the 'show apply button, it should work prnt.sc/AQbZxDHtwgBg

filenewcreate.com/elementor-21164/

@@crocomentor Very helpful. Thanks so much.