Problema: A máscara de telefone do plugin inserida através do jQuery Mask conflita com outras solu??es que oferecem máscaras/valida??o dos campos de telefone (Ex: Fluid Checkout Pro, etc). Pode afetar principalmente lojas que fazem vendas para diversos países além do Brasil.

Caso de estudo: Pois bem, em minha loja utilizo o plugin Fluid Checkout Pro com a op??o de telefones internacionais ativada. Esse plugin utiliza uma solu??o chamada de “intlTelInput”, uma biblioteca amplamente usada para inser??o de máscaras e valida??o de campos de telefone do mundo inteiro. Utilizo essa op??o, pois isso traz mais comodidade para o usuário, já que ele pode escolher a bandeira do país do seu número, e o campo automaticamente é preenchido com o código daquele país e a formata??o correta. Foi ent?o que passei a ter diversos problemas de conflito entre o “intlTelInput” e o jQuery Mask (presente no Brazilian Market) e resolvi ent?o desativar o jQuery, já que a outra solu??o é mais completa e oferece suporte para todos os países que eu vendo. Foi aí que come?ou as surpresas. N?o há como desativar a máscara de campos de forma nativa (o programador n?o quis colocar essa solu??o como uma chave para ativar/desativar). Tentei através de códigos snippets: N?o funciona! Tentei através de javascript: N?o funciona! Tentei até mesmo modificar os arquivos do plugin, comentando as linhas no frontend.js, resultado: N?o funciona! No desespero, excluí a pasta do jQuery Mask do plugin, resultado: O campo de telefone ainda estava usando a máscara do jQuery. Passei horas (muitas horas) buscando uma alternativa para desabilitar o jQuery e n?o havia nenhuma solu??o, a única forma de desabilitar, era desativando o plugin inteiro (Brazilian Market), mas aí n?o é possível vender para o Brasil, já que até hoje n?o há uma solu??o por parte do Woocommerce que atenda o mercado, nos obrigando a usar essa “bomba sem suporte” para poder vender para cá. Até mesmo os gateways brasileiros exigem esse plugin terrível! Bom, após muito tempo e gra?as a ajuda incansável do chatgpt, descobri uma solu??o para desativar o jQuery Mask desse plugin (que mais parece ter sido inserido como um vírus), que compartilho com vocês agora:

Solu??o: Adicione esse código usando um plugin de snippet ou outro:

add_action( 'wp_enqueue_scripts', 'override_mask_for_phone_field', 999 ); function override_mask_for_phone_field() { wp_add_inline_script( 'woocommerce-extra-checkout-fields-for-brazil-front', " (function($){ var originalMask = $.fn.mask; $.fn.mask = function(pattern, options) { // Se o elemento for o campo de telefone ou celular, n?o aplica a máscara if ( this.attr('id') === 'billing_phone' || this.attr('id') === 'billing_cellphone' ) { return this; } return originalMask.apply(this, arguments); }; })(jQuery); " ); }

Essa fun??o utiliza um handle (que demorou para ser descoberto) (woocommerce-extra-checkout-fields-for-brazil-front) do plugin, “sequestrando” a requisi??o e aplicando a solu??o antes que ele seja inserido na página.

A solu??o só atua no campo de telefone (billing_phone), mas pode ser estendida para outros campos onde a máscara do jQuery Mask é adotada, se necessário.

Por fim, isso desativa o jQuery Mask e permite que você utilize outras solu??es para aplicar máscaras no campo de telefone.

I am scheduling them using ical and would love to create events ahead, but then only display today’s one and the past ones.

I found a way to do it in a list view (I created two instances of a shortcode: one for today that has limitdays=”1″, and another one with the reverse=”true”) but the month and week views display all events.

Would there be a way to hide the future events on other views, or use the mask for them? They would then unhide/unmask on midnight (or even at a specified time!) on the actual date.

Thank you!

??What I ask you is to add filter just like you have for shape dividers ‘elementor/shapes/additional_shapes’ -> https://prnt.sc/3rcUkSowC-ta but also for widget mask kinda (‘elementor/masks/additional_masks’ / ‘elementor/masks/additional_mask-shapes’) -> https://gyazo.com/c0b39f46db270e89a007618c89e8d259.??I am sure it is not hard for you to add such filters that will give us possibility
to add many more customization options of masks.

??Regards, @stas0238

Thanks in advance.

100% Funcional e útil!

Além do suporte do Eduardo que é excelente.

Super recomendo!

I’ve wanted to use some PNG’s of my artwork on my site however any PNG’s I try to optimise are always like 500kb. So I thought of a way to try and dramatically reduce this and thought I may be able to use and JPEG with a CSS Mask to make it appear as a PNG while the file size would only be about 90kb.

This is where Custom Blocks comes in. I thought I could use it to create a simple image class where you select the JPEG image and the mask SVG and it will automatically mask it for you will out me have to create new CSS for every transparent image I want.

My plan was to set up an HTML IMG using the image field name. Then set up a CSS mask and link to the SVG using the Field Name so I don’t have to write new CSS every time.

This is what I got:

/* HTML */
<div class="DBTB-img-mask-container">
    <img class="DBTB-img-mask" src="{{image}}">
    </img>
</div>

/* CSS */
.DBTB-img-mask-container .DBTB-img-mask {
  mask-image: url({{image-mask}});
  -webkit-mask-box-image: url({{image-mask}});
  mask-border: url({{image-mask}});
}

Now, this all works, except the Image mask in the Custom Block CSS doesn’t pull through the SVG Link like the HTML one does. Is there any way I can change or fix this to get this to work?

Any help will be greatly appreciated,
Thanks.