In 2023 we have an option to finally work with full-site editing mode and to create a unique block theme inside WordPress’s new (Beta) Editor. I’ve started to make a new block theme for a multilanguage RTL website and write down my notes below.
Continue readingPopup Maker Plugin: Make Popup Stick to Screen’s Bottom in Safari
Popup Maker is a great and very popular plugin for WordPress. Very useful, i.e. to create a GDPR notification easily. Typically you’ll set up a cookie, attach a popup to the bottom of the screen, choose a fixed position and disable the overlay, and it will work.
Continue readingGet Blog Template Content Visible in WordPress
By default the content you add to a designated Blog page in WordPress won’t be visible on the front-end. The template called home.php will overwrite any content you input to the editor on that page. This could be changed by adding the following PHP code to this template, where needed.
Continue readingSimple Form Labels Animation with CSS
I’ve struggled to animate form labels and placeholders. Previous solutions didn’t work, because I wasn’t able to change the label’s position inside HTML. Previous solutions I’ve seen are all required labels or another element to be put below the input field. But I was adding CSS to HubSpot forms, where we can’t change their HTML.
Continue readingUpdating to WordPress 5.6 for Blocks Based Theme Fix
I have a block-based theme using Gutenberg editor. After updating to WordPress 5.6 the editor window with a collection of full width blocks was pushing the sidebar out of editor page margins.
Continue readingDisable WordPress 5.5 Lazy Loading Image when Using wp_get_attachment_image()
WordPress 5.5 now has lazy loading for images enabled by default. Tried many things to disable it for specific images, but only this worked. I’ve seen many places recommending to use array(‘loading’ => false) but it didn’t work.
Continue readingTransition Animation of CSS Gradient for background-clip: text
Smooth animation for CSS gradient clipped to text. As we all know, we can’t animate backgrounds with transition. So I’m moving gradients to make a perfect animation with transition
on hover
, without creating separate animation frames.
WP Bakery Page Builder and WPML Manual Translation Settings
If you have several languages enabled and you want to use manual translation of independently designed pages (WPML‘s Classic Translation Editor), you need to enable _wpb_shortcodes_custom_css
TRANSLATE in Settings > Custom Fields Translation!
Modify Yoast SEO Breadcrumbs with Additional Item
Breadcrumbs provide user navigation functionality and SEO benefits, that cannot be missed. Yoast SEO plugin can help to implement breadcrumbs into your templates with a simple snippet and elaborate back-end settings and options.
Continue readingMinimal CSS Styles for prettyPhoto RTL Lightbox inside Visual Composer Page Builder for WordPress
prettyPhoto is one of most loved lightboxes and it is integrated into Visual Composer single image widgets and galleries. For RTL website I had to make it compatible, because all its hidden texts became visible for Right-to-Left version. Another problem was that when lightbox was active, there was a long horizontal scrollbar at the bottom, that allowed to scroll left to about 6000px width. This was fixed too.
Masonry Gallery RTL Solution for Visual Composer – Page Builder
I had a big trouble to enable Right-to Left support for masonry scripts that come from Visual Composer Page Builder plugin for WordPress. If you have a multilingual website that switches from LTR to RTL it becomes a really big problem.
Continue reading