I AM LISTENING TO
|
WHAT I LIKE
  • English
  • German


BLOG FILTER



Elementor Pro provides grid containers as an experimental feature. The options provided are limited, when it comes to native controls. The fine-tuning of the grid container items need to be done using Advanced CSS.

If you are looking for a simpler way without using Advanced CSS, I started building out a Grid Tweaker for Elementor.

portalZINE NMN | Development meets Creativity | grid tweaker 1
portalZINE NMN | Development meets Creativity | grid tweaker 2

This will add a new tab to all containers and allows you to tweak grid-row / grid-column. Basic work is done. I am currently tweaking the controls a bit and will make it even easier ;)

Added an example template to import into Elementor. For those interested, the plugin can be freely downloaded from my Github repository. You can also do a search for “cubicfusion-grid-tweaker” on Github.

Cheers and enjoy
Alex

readmore

Archaeology Travel

I had the chance this year to meetup with my client Thomas Dowson from “Archaeology Travel Media” at the Travel Innovation Summit in Seville.

Over the past 2 years we have been revamping all the content from archaeology-travel.com and integrated a sophisticated travel itinerary builder system into the mix. We are almost feature complete and are currently fine-tuning the system. New explorers are welcome to signup and testdrive our set of unique features.

It was so nice to finally meet the whole team in person and celebrate what we have accomplished together so far.

What is Archaeology Travel all about?

Directly taken from the front-page :)

EXPLORE THE WORLD’S PASTS WITH ARCHAEOLOGY TRAVEL GUIDES, CRAFTED BY EXPERIENCED ARCHAEOLOGISTS & HISTORIANS

Whatever your preferred style of travel, budget or luxury, backpacker or hand luggage only, slow or adventure, if you are interested in archaeology, history and art this is an online travel guide just for you.

Here you will find ideas for where to go, what sites, monuments, museums and art galleries to see, as well as information and tips on how to get there and what tickets to buy.

Our destination and thematic guides are designed to assist you to find and/or create adventures in archaeology and history that suit you, be it a bucket list trip or visiting a hidden gem nearby.”

More Details
About
Mission & Vision
Code of Ethics

What is next?

We are constantly expanding our set of curated destinations, locations and POIs. Our plan is it, to make it even easier to find unique places for your next travel experience.

We are also working on partnerships to enhance travel options and offer a even broader variety of additional content.

Looking forward to all the things to come, as well as to the continued exceptional collaboration between all team members.

Lets continue to help bring the world’s past to the future :)

readmore

First a bit of context :)

What is Gettext?

Translation within WordPress is based of Gettext. Gettext is a software internationalization and localization (i18n) framework used in many programming languages to facilitate the translation of software applications into different languages. It provides a set of tools and libraries for managing multilingual strings and translating them into various languages.

The primary goal of Gettext is to separate the text displayed in an application from the code that generates it. It allows developers to mark strings in their code that need to be translated and provides mechanisms for extracting those strings into a separate file known as a “message catalog” or “translation template.”

The translation template file contains the original strings and serves as a basis for translators to provide translations for different languages. Translators use specialized tools, such as poedit or Lokalize, to work with the message catalog files. These tools help them associate translated strings with their corresponding original strings, making the translation process more manageable.

At runtime, Gettext libraries are used to retrieve the appropriate translated strings based on the user’s language preferences and the available translations in the message catalog. It allows applications to display the user interface, messages, and other text elements in the language preferred by the user.

Gettext is widely used in various programming languages, including C, C++, Python, Ruby, PHP, and many others. It has become a de facto standard for internationalization and localization in the software development community due to its flexibility and extensive support in different programming environments.

What are WordPress language files?

WordPress uses dedicated language files to store translations of your strings of text in other languages. Two formats are used:

  1. Portable Object (PO) files: They serve as the message catalog, containing the original strings that need to be translated and placeholders for the translations. Each entry in a PO file consists of several fields:
    • msgid: This field represents the original string that needs to be translated.
    • msgstr: This field holds the translated string corresponding to the msgid field.
    • Comments: PO files may include comments that provide context or instructions for translators. These comments start with a “#” symbol.
  2. Machine Object (MO) files: MO files are generated from PO files using a compilation process. The compilation process converts the human-readable PO file, which contains the original strings and their translations, into a more compact and efficient binary format suitable for runtime use.

    The purpose of MO files is to provide a faster and more efficient way of accessing translations during the execution of a software application. Instead of parsing and processing the text-based PO files at runtime, the Gettext libraries directly read the pre-compiled MO files.

Caching Language Files!

There has been a discussion for years, if it makes sense to cache mo-files, to speedup WordPress when multiple languages are in use. Discussion of the WordPress Core team.

There have been a couple of plugins trying to fix this and prevent reloading of language files on every pageload.

Most of these use transients in your database and object caches if active.

Does it really make any sense?

Well it all depends on the amount of language files and your infrastructure. This load/parse operation is quite CPU-intensive and does spend quite a significant amount of time.

I have decided, not to bother with it in the past :) But I am always looking for ways to speed up multi-lingual websites, as that is my daily bread & butter ;) Checkout Index WP MySQL For Speed & Index WP Users For Speed, which optimizes the MySQL Indexes for optimal speed. That change, really does make a bit difference!

Native Gettext for WordPress

One thing that can help to speed up things, is to use the native gettext extension and not the WordPress integration of it. This will indeed help speedup translation processing and help big multilingual websites.

Native Gettext for WordPress by Colin Leroy-Mira, provides just that.

Disable Gettext, when only using English!

Create a must use plugin and add this:

This will prevent any .mo file from loading.

Use the gettext filter to change any translatable string.

Please consider the performance impact. Read about it at the main documentation.

Enjoy ….

readmore

Extending iPanorama 360 can be a challenge, as none of the events are documented. You can talk to the developer or ask for support to get things done.

You can also read up on the core assets used:
ipanorama.min.js
jquery.ipanorama.min.js.

You can easily search for the events and figure out the parameters passed. Here a quick reference for things I used so far.

Main Events

Tooltip Events

Popover Events

Scene / Camera Events

Some Examples

Lock rotation

Custom Marker Click

Custom loading

readmore

WHAT IS IPANORAMA 360?

iPanorama 360 for WordPress is a specialized plugin that enables users to create and display interactive 360-degree virtual tours or panoramic images on WordPress websites. It extends the functionality of the WordPress content management system by providing a user-friendly interface and a range of features specifically tailored for creating and showcasing 360-degree content.

With iPanorama 360 for WordPress, you can upload panoramic images or sets of photographs and convert them into interactive virtual tours or panoramic sliders. The plugin offers customization options to adjust the appearance and behavior of the panoramas, such as controlling the speed of rotation, choosing navigation controls, adding hotspots, and incorporating multimedia elements like images, videos, or audio.

The plugin integrates seamlessly with WordPress, allowing you to embed the created virtual tours or panoramic images directly into your website pages or posts. You can also customize the tour settings, such as enabling or disabling auto-rotation, adjusting the initial zoom level, or defining the starting viewpoint.

iPanorama 360 for WordPress typically provides an intuitive visual editor that enables users to create and edit their virtual tours or panoramas using a drag-and-drop interface. This makes it easier to add hotspots, link to other panoramas or external content, and customize the appearance and functionality of the tour.

IPANORAMA 360 FEATURES

  • 3 Scene Types – cube, sphere and cylinder
  • HotSpots – allows you to mark different areas that you want to point out
  • Virtual Tour – travel from one to another scene by clicking on special hotspots
  • Tooltip System – the plugin has a build-in powerful tooltip system
  • Compass – you can be sure to look forward
  • Preview Image – you can set an image that will show as a preview
  • Fullscreen – you can toggle from the normal state to fullscreen and back
  • Mouse Wheel – zoom with mouse wheel scrolling
  • Keyboard – arrows can be used for navigation through the scene
  • Touch – touch was used for navigation tasks
  • Autoplay – the scene autorotate around a vertical axis
  • Awesome Looks – 2 predefined themes
  • View customization – create your own theme

You can testdrive iPanorama 360 using the Lite version or get the Pro version. The only limitation for the Lite version, is the ability to only create one panorama.

ADDING AN ARIAL / FLOOR MAP TO IPANORAMA 360!

portalZINE NMN | Development meets Creativity | cubicfusion hotspot8

I have tested many different solutions for 360 panoramas in the past and many have been lacking in one or more areas. I always seem to be coming back to iPanorama 360 for my projects, due to its solid editor and support.

One major problem for iPanorama 360 has been the ability to attach an Arial-map / Floor-map to the panorama. Others tried to fill that void, but mostly failed on Mobile.

There are solutions out there that could be reused (Image Map Pro / ImageLinks ) and integrated with iPanorama 360.

I decided to build an image hotspot solution myself, that can also tie into iPanorama. I am building out all the things I need and more :)

CURRENT & PLANNED FEATURES

  1. Hotspot drag and drop positioning.
  2. Image Hotspot or SVG based hotspots (Size, Fill , Border, Color).
  3. Hotspot in and out animations.
  4. Tooltip system, supporting full Media and HTML. Still expanding on that. I am not sure yet, what will finally be in the first version.
  5. Popover option.
  6. iPanorama 360 – Add arial / floor map support. Guided setup, with full automatic integration in the future. Only 1 week into development, so this might change.
  7. iPanorama 360 – Radar view, which hooks into the current camera view and shows you what you are seeing on the map.
  8. External link support.
  9. Custom ID and classes per hotspot, to allow additional hooks or visual changes.
  10. Hotspot JS Events (Click, Over, Out and Active)
  11. REST Api
  12. Shortcode support. Fully detached from iPanorama, which allows to add it to a popover, slideout or any other design construct you envision.
  13. TWIG Template support, for the shortcode, to easily tweak the layout.
  14. Elementor support.
  15. Gutenberg support.

The first version is basically done and I will be using it for a client shortly. If you are interested, please feel free to get in touch. Will setup a demo page soon or link to the client using it ;)

PREVIEW

Cheers

readmore

THE QUESTION

A while back a potential customer asked me, if it is possible to restructure a WordPress Multisite setup and WPML with a more simplified and custom url structure?


THE ROUGH IDEA

1 . BASE.website web.site (with possibly different languages)

web.site/de/
web.site/en/

2. SUB.website web.site/nl-nl/

Languages would normally be added like this:

web.site/nl-nl/de/
web.site/nl-nl/en/

The customer wanted it to be restructured / simplified like this:

web.site/de-nl/
web.site/en-nl/

This basically mimics the structure of a single WPML website with custom languages, but with all the benefits of a multisite.

THE SOLUTION

This is nothing that WPML or WordPress Multisite provides out of the box.
I built a prototype setup to make it work.

Not something that I would propose for anyone, as it requires a lot of tweaks for anything that handles dynamic links (plugins, hooks, core systems, page.builder …)

Its doable :)

BASIC URL HANDLING

One thing that needs to be tweaked globally, is the mapping of the new url structure.

So web.site/nl-nl/en/ needs to become web.site/en-nl/

This needs to be handled on the server side, by proxying the original to the new structure.
This can be easily done using Apache or NGINX.

With that web.site/nl-nl/en/ will be proxied to web.site/en-nl/, but any core navigation will not work yet.

This is the fastest solution that I came up with, within the hour I gave myself ;)

There surely are other options, like the core rewrites / restructuring of the core shorturl handling. But these approaches might break things in far more areas.

Using the proxy approach, keeps the core as it is. The solution needs to be as simple as possible, allowing to maintain it in the future :)

HOOKS TO THE RESCUE

Just for the basic setup a couple of hooks are required to make this work, more might be needed depending on the plugins in use.

Here a couple of examples ….
WordPress site_url

WordPress Nav Links

WPML

Rankmath

This will not cover every angle, but will give you a starting point! I love my puzzles and there always is a viable solution :)

Need something similar … get in touch!

Happy coding …

readmore

What Google Drive Sharing offers us!

I am doing a Podcast on portalZINE.TV since last year and always host a backup of the MP3 episodes on Google Drive.

The link that you create, when enabling file sharing on Google Drive, can not be used to actually embed it on your website.

The link looks something like that:

To actually use it directly, we need to get the ID. Sure, you  could just extract the ID, but often we just want to copy and paste. The sharing link is also your actual reference to the original file, which I store together with the podcast.

Apply a simple RegEX

We use a simple Regex to extract the ID:

PHP

JAVASCRIPT

Just use it!

This ID can than be used to embed the file directly using HTML5 audio controls.

Its important to use the “https://docs.google.com/uc?export=open&id=” url to open the file, as it provides the direct access to the shared file

readmore

BOOKING SOLUTIONS 202x

This is my take on a subset of booking, appointment, PMS or reservation solutions for WordPress.

Update 11.10.
Moving down the rabbit hole again :)
Will be diving a bit deeper into some the solutions and their feature-set. Might split this up into multiple posts :) Will see, which of the developers is interested in an open review or not.

Those currently on board:

  1. Crocoblocks / JETPlugins: First in line will be crocoblock with JETbooking / JETappointment. Thanks goes out to crocoblock for helping out and making this review possible :) More about this soon …
  2. PluginHive: Will be sticking to the base information provided by PluginHive and their test setups. This means that I am not currently deep testing their solution.
  3. MotoPress: waiting for an answer :)
  4. PinPoint: waiting for an answer :)
  5. YITH: Will be taking a closer look at Yith as it combines booking & appointments.
  6. WooCommerce Booking: Will setup the plugin and look at this again, but pretty undecided right now. Had my problems with it in the past.
  7. VikWP: I might be looking at it a bit closer in the future, but currently not a right fit to compare, as its target audience is the single property owner. But I still think it belongs into the list ;)

Some rules … before I start!

There are so many booking / appointment solutions out there, that its really hard to decide, which solution is the right one for your specific project and needs.

I will only list those that fit my own internal criteria.
Not all of them will always match, but it should be as close as possible :)

  1. Its not just a cheap theme bundle or addon. There are 100s of solutions out there, that claim to be free and just sell / promote their PREMIUM themes with a nice little addon. Might be enough for you, but not for me ;)
  2. Has a solid standing in the community.
  3. Has been around longer than 6 months.
  4. Has a real set of developers behind it, that work on new features.
  5. Has a support or community forum, where actual help can be found.
  6. Has documentation for the future administrator of the plugin.
  7. Has documentation for developers, helping to make it work for their clients. Extendability is always a plus.
  8. Has good theme or framework support.
  9. Has a good feature to price ratio.
  10. Has multi-language support (WPML)
  11. Makes me want to use it myself or promote it to my clients.

Just to be clear, this is highly opinionated, as is every other list claiming to have the best available solutions for you ;)
But this is how I would approach it together with my clients!


Property Management System ( PMS )?

A Property Management System ( PMS ) or Hotel Operating System ( HOS ) is an overkill for most projects, but provides booking, reservations, appointment logic, logistics, accounting and many other features.

My main focus is not the PMS market, but its always nice to have the option to extend a setup in the future, if additional requirements come up.

SaaS ( Software as a Service)

This is about full WordPress solutions, but there are also solutions that integrate with WordPress, but are hosted externally.

Like Checkfront for example and their WordPress integration.
You pay a monthly fee, depending on your yearly requirements.

The problem with a SaaS, is that you are limited to their feature set. If you want to integrate your own features and develop a specific extension for them, it is not always possible.

Some provide API access for extendability, but extending upon that can be pricey. And often its hard to decide, which service will really stick around and not vanish at some point.

But they are a nice quick solution, to get you started.

Bundled Theme / Theme Framework / Your Own Theme

This is where many offers try to lure you in. They offer premium themes that look amazing with demo content, bundled with a basic addon that features common functionality for the hotel booking market.

Some are pretty basic, some of these addons go pretty far.

For a B&B or hotel owner, it is pretty difficult to decide, which is the right one to choose.

You just see pretty pictures, perfect matching text and a workflow of many things, that just seem to work.

But does it really work for your feature-set?
How good is the documentation for the booking addon?
Do they provide a community forum to help with adjustments?

If none of the above is satisfying, please RUN :)

Don’t waste your money and stay away from frustration!

Most of the booking solutions are based around WooCommerce and there are 1000s of themes that are compatible.

There is no reason to bundle theme and booking addons, unless you really have a feature-set, that perfectly matches and will not grow in the future!

Choose a theme that is well supported, uses the framework of your choice and liking OR find someone to build a unique theme for you.

OTA (Over-The-Air) Channel Manager

A Channel Manager is a module that allows you to connect & synchronize your OTA channels (such as Booking.com, AirBnB, Expedia, Hotels.com, HomeAway, Trip Advisor, etc.).

The goal is to have no overbooking, just one calendar to manage all reservations, rates & availability.

This is a big topic and complicated in many ways. Some solutions offer some kind of 1-way or 2-way sync via iCal.

You can also use external services like Syncbnb or OTA Sync. This alone is a rabbit-hole of its own :) Not going there yet …. But it is an important question, if you plan to offer your bookings externally and do not wish to sync availability / reservations manually.

Lets prepare some initial questions for you!

Before choosing anything you should really pinpoint your own requirements.

  1. What is my current budget? What I am willing to pay for updates or on a regular basis?
  2. When do I plan to start? (development timeframe)
  3. Which features do I need right now?
  4. Which features do I need in the coming 6 months?
  5. Which features are nice to have?
  6. Which features are a must-have?
  7. Will I do the required updating and support for the system myself?
  8. Do I want to be responsible for security and the handling of personal data?
  9. Will I use my own theme, a framework or premium theme?
  10. Do I require or need WooCommerce integrated?
  11. Do I need multi-language support ( WPML )?
  12. Do I need an OTA Channel Manager to sync with Booking.com or any other external channel?

MY CURRENT PICKS

This is a starting list of solutions, that I handpicked following the rules I set myself. This list might grow in the future, depending on additional plugins I discover.

I have a new WPML client, that is starting fresh and already leaned on a theme based solution. He has some project requirements, that already leave him stuck in certain areas.

That is why I decided to take a deeper look at things currently available. I have touched many of these before, but taking a fresh look at them ;)

I am not comparing features, just presenting those that are good candidates to build a great booking setup.

You will need to do a feature matrix for your project and see which areas are covered by each plugin. No way around that :)

portalZINE NMN | Development meets Creativity | hotel booking vik booking

#1 Vik Booking (E4J)

Certified booking system and PMS Plugin for Hotels, B&B, Villas and Apartments.

E4J started with Joomla CMS integrations and added WordPress in 2018.

From their website: “The project VikWP – VikWordPress.com was born in 2018, it’s a newly born project, but it has more experience than ever by background. The company E4J has been one of the leading extensions development companies for Joomla since 2009. That’s how we started to get known with our software. “

Not many websites talk about it, but it has an amazing feature-set at a pretty descent price for the Pro version.

This plugin has no WooCommerce support and relies solely on their own payment integrations. They offer full PCI-DSS compliance for their payment gateways.

They offer a free and pro version, with the free version already having a good set of features.

One of the biggest benefits of the Pro Version is the possible integration of the channel manager, which allows you to sync your bookings with other external services (booking.com, airbnb …)

And if PMS features are important to you, the Pro version is the right plugin for you.

The price can quickly accumulate, depending on the payment gateways needed, which is not so much different to WooCommerce ;)

You also have to calculate in the Channel Manager, if you want to sync with external service providers.

The plugins target audience is more single properties or appartment complexes.

To get you started

A Vik Theme – Plaza – LINK

Appointment Manager – LINK

Documentation – LINK

Frontend Demo – LINK

Admin Demo- LINK

Price Range

FREE (Limited Payment Gateways / No Channel Manager)

or

PRO – 140 EUR (≈ $165) + Channel Manager: 79 EUR (≈ $93)

What is missing?

A merged use of the booking plugin, appointment plugin, item rent plugin is not possible. There is no shared shopping basket.

portalZINE NMN | Development meets Creativity | hotel booking pinpoint

#2 Pinpoint – Booking System Pro ( Pinpoint World LLC )

Pinpoint Booking System comes with a clean interface, a multipurpose functionality and an amazing range of booking features.

Suitable for businesses such as hotel accommodation, guesthouses rentals, appointments, scheduling conferences, and meetings or rental businesses to simplify the booking process for their customers.

  • Booking calendar – Demo
  • Book days
  • Book hours/minutes
  • WooCommerce support
  • Multi-language support
  • Reservations
  • Booking rules
  • Discounts
  • Coupons & vouchers
  • iCal support for export & import
  • More here

To get you started

Documentation – LINK

Extensions – LINK

WooCommerce Support – LINK

Price Range

Booking: FREE or PRO – $70

What is missing?

Do your feature matrix!

portalZINE NMN | Development meets Creativity | hotel booking motopress

#3 MotoPress – Hotel Booking Plugin ( Jetimpex )

Motopress has been a go-to for many projects in the past. When you search for booking solutions, it will always come up.

“The MotoPress WordPress Hotel Booking plugin is an all-in-one property management suite for rental property websites. List unlimited accommodations and services, accept direct online reservations, synchronize all bookings across OTAs and more (no per-booking or per-property commission). This WordPress hotel booking plugin is perfect for running any hospitality business establishment regardless of the size, function or cost: a hotel, vacation rental, apartments agency, hostel and more.” – statement from their website.

  • Two-way auto-synchronization of iCal with external booking platforms to exchange booking calendar data and avoid overbooking.
  • Email notifications with booking details, booking confirmation / cancellation notes and other important messages for both admin and guests.
  • Reservation of an unlimited number of accommodations during one booking session.
  • Integration with the WooCommerce Payments add-on to get more payment gateways.
  • Categorization of your accommodations according to any parameters (e.g. location, price range, etc.), which enables an advanced search for them.
  • Creation of discount coupons with monetary value or percentage discount coupons.
  • Demo availability to test both the back-end management area and front-end performance.
  • Broad knowledge base with detailed and instructive video tutorials.

To get you started

Demo – LINK

Documentation – LINK

Forum – LINK

Addons – LINK

Price Range

Booking: PRO – $89

What is missing?

Do your feature matrix !

portalZINE NMN | Development meets Creativity | hotel booking pluginhive booking

#4 WooCommerce Bookings and Appointments ( PluginHive )

Another plugin that has been around for a long time and grown in popularity as well as features.

  • Offer Bookings in Minutes, Hours, Days or Months
  • Allow users to book Multiple Days or Multiple Appointments at a time
  • Offer Multiple Bookings for the same time slot
  • Set a Minimum and Maximum Booking duration – For Eg: Users can book Minimum of 2 days up to 8 days
  • Allow Booking Cancellations—Set a Time Limit until which Cancellations can be accepted before the booking starts
  • Enable Booking Approvals/Confirmations from the Admin
  • Convert your bookings calendar into Accommodation bookings.
  • Allow per night bookings and display the Check-In and Check-Out date
  • Email notifications to users and admin for a New Booking, Confirmations, and Cancellations
  • Email Reminders to users for upcoming bookings
  • Dynamic total Booking Cost calculation based on number of days or time slots selected
  • Capture Additional information from the users by enabling the Booking Notes field
  • Allow Buffer or Padding time between Bookings(Flexible Buffer After/Before a Booking)
  • Change the Calendar Color to suit your Website Design/Theme
  • Google Calendar Sync
  • Staff Management–Add any number of Staff | Manage Staff Availability | Manage Prices | Manage Leaves
  • WPML support
  • More

To get you started

Demo Frontend – LINK

Demo Backend – LINK

Documentation – LINK

Price Range

Booking: PRO – $99

What is missing?

Do your feature matrix!

portalZINE NMN | Development meets Creativity | hotel booking jetbooking

#5 JETbooking for Elementor ( crocoblock )

“JetBooking plugin is a unique addon developed by the Crocoblock team specifically for rent and booking services, such as vehicles, dresses, apartments, etc.” – Introduction

If you love the possibilities and concept of Elementor, JetBooking could be of interest for you. The extension provides a different approach with similar features or better than those above.

Check their feature comparison here.

I have not played with JETbooking yet, but have worked with almost all their other extensions so far!
Love their style and integration with Elementor.

crocoblock offers a whole suite of plugins that enhance Elementor.
Really high quality extensions, with an amazing detail to design and functionality.

Feature highlights

  • Custom booking post-type & setup
  • Custom Booking Forms and fields
  • Single-page booking
  • WooCommerce integration
  • Neat filter system
  • Google Calendar / Integromat / Zapier / iCal synchronization

To get you started

Demo – LINK

Documentation – LINK

REST API – LINK

JETengine – LINK

JETsmartfilters – LINK

Free Kava Theme – LINK

Dynamic Templates – LINK

JETThemeCore – LINK

crocoblock JETPlugins – LINK

Price Range

JETbooking $19 + JETengine $26 + JETsmartfilters $24 or JET Bundle $130

What is missing?

A channel manager to sync with Airbnb / Booking.com etc, is missing. They have a video tutorial up, that showcases synchronisation to Google Calendar via Zapier / Integromat. I am sure you could also use n8n.io, which you can host yourself ;)

portalZINE NMN | Development meets Creativity | booking yith

#6 YITH Booking and appointment for WooCommerce

I totally forgot about YITH, even though they are the poster child for good WooCommerce solutions.

The plugin implements a booking/appointment system to manage booking of services, rooms, accommodation facilities and more.

It feels more expensive than those above, but it has a huge feature-set and includes bookings and appointments!

YITH shines, when it comes to their documentation.

To get you started

Features – LINK

Demo – LINK

Documentation – LINK

Price Range

$200

What is missing?

Conclusion

These are just some possible solutions. Hope this gives you a little jump-start.
D’ont just use the first best thing, even if it looks impressive on first glance!


I will adjust and tweak this article, as new things come up.

Enjoy coding ….

readmore

INTRODUCTION

This is not a tutorial, but more like sharing a nice geeky road-trip ;)

I have a pretty good understanding of the Youtube Data API, as I have actively used it on portalZINE TV in the past, to upload videos and dynamically link them to my local post-types.

For one of my latest customer projects (TYPEMYKNIFE / typemyknife.com), the task was a bit more complicated and the goal was to make it as future-proof as it can be with the Google APIs :)

Prerequisites / References to get you started:

portalZINE NMN | Development meets Creativity | youtube data api

THE GOALS

The goal for the setup was to actively synchronize WooCommerce products with linked / attached videos, with their source at Youtube.

As the website is multilingual, WPML integration is critical as well. And as Youtube allows localization of title and description, that can be added into the mix quiet easily in the future ;)

The following product attributes should be mirrored and optimised for Youtube:

  • Product Title
  • Product Description (5000 character limit at Youtube)
    My customer already has a pretty long and detailed description, which is perfect for Youtube!
    We average around 2900-3000 characters.
  • Product Tags (500 character length limit at Youtube)

The following attributes should be integrated into the description to enrich the Youtube description:

  • Introduction
  • Product Link to WooCommerce Product / Shop
  • Socials
  • Legal Information
  • Hash Tags (local post-type to add recurring / important hash tags)
  • Outro

All of these attributes will be collected internally and assigned using a simple template system, which allows the customer to move parts around freely and freely layout the description for Youtube.

The following stats will be collected for review:

  • Products without a video linked (no relation)
  • Products with the same video linked (duplication)
  • Videos without a product in the system
  • Total amount of videos / amount of video-pages (50 videos max per page)
  • Total amount of products with videos

Youtube SEO

These are the relevant key aspects, that help to get your videos more views.

  • Relevant text featuring at least 1,000 characters
  • Keywords that are relevant on Google Search and YouTube and describe your video
  • Hashtags, can also be used within the text
  • Timestamps Links to related content / affiliate links
portalZINE NMN | Development meets Creativity | youtube data api auth

PREPARING AUTH / OAUTH2 AT GOOGLE

In the past access to the Youtube Data API was far easier and less limited, when it comes to offline / none expiring OAuth2 refresh tokens.

When you are building a server-side application that is only available to your customer or moderators, it makes no sense to run that app through the Google App verification. Your app will never be used in public.

The Youtube Data API and its scopes, are defined as sensitive and therefor require third-party security assessment for public access.

The scopes I am requesting are https://www.googleapis.com/auth/youtube.upload + https://www.googleapis.com/auth/youtube.

Because of that its far easier to just setup OAuth 2 in test mode and restrict access to your customer and specific additional accounts only (up to 100 test users allowed). What all these account need, is access to your own or Brand Youtube Channel.

Preparation in the Google Cloud Console:

  • Activate Youtube Data API
  • Create OAuth2 Client ID
    • Name
    • Allowed Redirects
  • Setup OAuth-Consent Screen
    • Name of the App
    • Support Email
    • Logo
    • Allowed Domains
    • Typ: External
    • Setup all test-users, all of these need access to your Youtube channel already

A detailed description can be found here.

You can circumvent verification for the consent screen, by using an organisation setup at Google. Here some infos about that. With that setup offline refresh tokens should work fine.

Update: Just tried that, but wont work with a branded youtube account, even though the cloud user has admin access to it. Not giving up yet, but Google / Youtube really makes it difficult to just have a simple offline solution for specific tasks ;) BTW also forced the login hint, to make sure the right account is logged in : $client->setLoginHint(‘YourWoreksapceAccount’); !

You might have heard of the “The League of Extraordinary Packages“. It is a group of developers who have banded together to build solid, well tested PHP packages using modern coding standards.

They also offer an OAuth2-client + OAuth2 Google extension that can be used.

SERVER SETUP

On the server, the Google API PHP SDK can be easily integrated using Composer.

In my customer plugin I neatly separated all relevant areas in classes & traits:

  • Online Authentification, with a 60 minute session
  • Offline Authentification, with a 1 week expiration (might explain that in more detail in the future.)
  • Error handling and debug information
  • Listing of videos
  • Updating of videos
  • Updating of tags
  • Updating hashtags
  • Backup old data locally, before update. There should always be an option to restore, especially with 500 videos :)
  • Settings & templates
  • REST routes / endpoints

You can check the expiry time of your access token by accessing:
https://www.googleapis.com/oauth2/v1/tokeninfo?access_token=YOUR_TOKEN

“A Google Cloud Platform project with an OAuth consent screen configured for an external user type and a publishing status of “Testing” is issued a refresh token expiring in 7 days.” – Google

Basic Auth example from the SDK:

A simple upload example can be found here .

portalZINE NMN | Development meets Creativity | youtube data api list

UPDATING A SINGLE VIDEO
BULK VIDEO UPDATES

All operations to and from the Youtube Data API are rate limited. What is important for us, are the queries per day.

The default quota is 10.000 queries per day, sounds a lot, but is easily gone after updating 150-200 videos. You can request this limit to be raised, but again a lot of paperwork and questions that are just not needed.

The above limit just means, that you need to cache as many queries as possible, to only query live when needed ;)

Something you learn fast, when experimenting with different things! I hit that limit multiple times in the first few days, with around 500 videos in the queue.

Different operation cost you different amount of units

  • A read operation that retrieves a list of resources — channels, videos, playlists — usually costs 1 unit.
  • A write operation that creates, updates, or deletes a resource usually costs 50 units.
    10.000 / 50 are 200 updates per day :)
  • A search request costs 100 units.
  • A video upload costs 1600 units. Glad we are not handling the upload as well, but technically easy ;)

It also helps to use the Google Developer Playground to testdrive the Youtube Data API with your own credentials while optimising your own code.
You can define your own OAuth 2.0 configuration by clicking the cog in the upper right corner.

I setup the bulk updating to allow splitting it over multiple days, if required. For this an offline refresh token is needed, as the standard token expires after 60 minutes.

My customer can also just update a single video, when changes are applied to the product or a new product has been added.

If more frequent updates are required, I will ask for a raise of the queries per day. You can circumvent the limit by using multiple Google Cloud Platform accounts with new OAuth credentials, but really an overkill right now. I have done that in the past ;)

LAYOUT & DESIGN

The GUI is just based of Bootstrap, to make it simple and clean. Using my own wrapper to make it work within the WordPress admin.

For all ajax operations, I am using htmx and _hyperscript, which I will talk about in another article in the future.

Really neat and clean way to build single page interfaces.

The whole plugin runs of its own REST API endpoint. Just love using WordPress as a headless system.

I used TWIG / Timber for the templates, to separate logic and layout. Timber has been my goto solution for years now. It drives my own and many customer websites.

portalZINE NMN | Development meets Creativity | road ends

CONCLUSION

This has been a lot of fun, maybe a bit too much LOL

I do geek-out about many of my projects, but this experience helped me to bring my WordPress toolbox to the next level. This will help to drive other things in the future.

Working so deeply with the Youtube Data API has been fun and feels so easy now, after all remaining problems have been solved.

Would have loved this during my portalZINE TV days ;)

I you read all this, you just earned yourself a badge for completion ;)

Need something similar or something else? Just say hi and we can talk.

ENJOY CODING ….

readmore

Getting started

“WPML (WordPress Multilingual) makes it easy to build multilingual sites and run them. It’s powerful enough for corporate sites, yet simple for blogs.” – WPML

I have been running and setting up multilingual websites for more than 12 years. WordPress and related integrations have gladly come a long way to make our life’s a lot easier.

For basic content WPML is almost plug & play, but I do see more and more sites / customers struggling with more complex setups. WPML is one of the most popular multilingual plugins and is used on x00.000 of websites.

Just so you know, WPML is a commercial solution!

Settings for almost everything

The amount of settings has increased a lot over the years and offers possible solutions for almost any content / plugin setup.

But for more complex setups, I would suggest to hire a professional to look over the settings or study the plugin documentation carefully.

Especially with a lot of content, it can quickly increase problems and the need to revisit specific content over and over again.

How to translate

WPML lets you translate any text that comes from themes / theme frameworks (DIVI, Elemetor, Gutenberg …), plugins, menus, slugs, SEO and additionally supported integrations (Gravity Forms, ACF, WooCommerce …).

You can translate content internally for yourself, using translation management to translate with an internal team of translators or get help from external translators / translation services.

The latest version also offers AI translations, which allows you to get a decent start for most of your content.

In addition to the above, WPML String Translation allows you to translate texts that are not in posts, pages and taxonomy. This includes the site’s tagline, general texts in admin screens, widget titles and many other areas.

Is it worth its money

Well, I am a bit biased. I have not looked much at other solutions for the past 5 years, as it offers all I really need.

I have used it on projects from 2 to 15 languages and it scales nicely. At least with proper hosting attached!

Anything can be tweaked through the API, Hooks and custom integrations. I have build additional WPML tools for my customers, to streamline some of the repeating / boring tasks.

Their support is responsive and the forum already provides a huge amount of answers to most of the questions that might come up.

If you develop / maintain multiple customer websites with multilingual content, the investment is quickly
amortized. I do offer WPML to my maintenance package customers, maybe something to consider ;)

Its an essential solution in my WP toolbox.

WPML 4.5

WPML 4.5 is on its way and will include a “Translate Everything” feature, among other fixes and enhancements.

Translate Everything allows you to translate all of your site’s content automatically as you create it. You can then review the translations on the front-end before publishing.


portalZINE NMN | Development meets Creativity | wpml logo transparent

WPML / Documentation

readmore