Hi
Does anyone one know the best way to create an EU compliant cookie pop up using beans and uikit?
Cheers Jason
Hello Jason,
I am currently on this question. My intention is to use the Notify UiKit component. I'll come back here as soon as I have something that works.
Mat
Hi Mat
Thanks for that. I look forward to hearing back from you.
Good luck.
Jason
Hey guys,
Here is an example snippet using the UIkit Notify component:
// Enqueue the necessary UIkit components.
add_action( 'beans_uikit_enqueue_scripts', 'example_enqueue_uikit_assets' );
function example_enqueue_uikit_assets() {
beans_uikit_enqueue_components( array( 'notify' ), 'add-ons' );
}
// Add your notificication.
add_action( 'wp_enqueue_scripts', 'example_notification' );
function example_notification() {
$message = __( 'Your cookie message.', 'example-domaine' );
wp_add_inline_script(
'uikit',
"( function( $ ) {
$( document ).ready( function() {
UIkit.notify( '{$message}', { status: 'warning' } );
} )
}( jQuery ) );"
);
}
I set the status
to warning
in the example above so that the notification is orange but feel free to change it according to your needs. Check the UIkit Notify component documentation to see all the arguments available. There are some cool stuff such as pos:'bottom-right'
which will display the notification at the bottom etc. You can also add HTML in your message, for example if you want to add UIkit icons etc.
Have fun with it π
Thanks Thierry
Out of interest - how would you add html and uikit icons?
Thanks Jason
For example, set the $message
variable to:
$message = '<i class="uk-icon-warning uk-margin-small-right"></i>' . __( 'Your cookie message.', 'example-domaine' );
Have fun,
Thanks Thierry
That's working awesome.
Only thing I need it to do is prevent it from constantly appearing on every page once it has previously been dismissed.
Is that possible at all?
Cheers Jason
Hi Jason,
Yes there is but it requires some code! You could either use local storage or cookies to store that the user has closed the notice. As much as I would love to, I can unfortunately not write a example for that because of time constraint π It is really out of the scope of Beans and you should be able to fine example for local storage or/and cookies using Javascript.
Have fun,