Welcome! This Forum is our main place to share official
announcements and to help you get support for them.es
products.
If you have general inquiries on WordPress or need
assistance with theme customizations, please head over to the following
sites, maintained by the awesome WordPress Community:
The new year starts great! A major milestone has been reached – our Bootstrap Starter Theme for WordPress was downloaded for the 25,000th time 🤩. Actually the number of websites out in the wild, using this theme as the foundation, may be even higher because we can’t measure 1:1 duplications and direct downloads from GitHub.
It’s very pleasant to see how one of our first OpenSource products evolved over time, with important quality improvements from contributors, valuable feedback from users and last but not least by looking at the numerous likes from stargazers. All the kudos we received prove that democracy, exchange and teamwork are still relevant today in a world (wide web) that’s transforming continuously.
THANK YOU to all friends, collaborators and developers (of underlying dependencies*) who made this possible!
* WordPress, Bootstrap, SASS, LESS, Webpack, Gulp, Grunt, NPM, etc.
WordPress is the leading web publishing platform standing for stability, reliability and sustainability, and celebrated its 20th anniversary last year. Bootstrap is the most popular HTML, CSS, and JavaScript frameworks for developing responsive, mobile first projects on the web.
them.es Bootstrap Starter Theme for WordPress combines the best of both worlds. Stay tuned for more because all in all it feels like the journey has only just begun…
Our WordPress invoicing plugin Billy and its companion Billy Pro have been refactored and finally make use of the Block API v2, resulting in a lighter DOM tree and an overall improved editor load time. Full backwards compatibility has been considered but if you’re using Billy Pro, it’s strongly advised to keep both plugins in sync and update each to the latest version.
In addition, the Pro add-on received new features for contacts. The contact selector in the post template has been rebuilt with an improved combobox selector and should help you finding the right contact quicker and easier. Furthermore it’s possible to upload a photo or logo to contacts for better identification.
In the edit post screen, invoices and quotes with status “overdue” and “pending” now show an eye-catching icon, indicating that the due date has been passed.
All in all we’re confident that this new release makes Billy (Pro) one of the best invoicing products currently available on the market – in particular for freelancers and small companies that are looking for a simple and uncomplicated solution with zero dependencies.
Did you know that the integration of this plugin in an existing WordPress website is a no-brainer and that you have total privacy control over your invoicing as no data every leaves the server or is shared with third-parties?
This tutorial helps you set up a basic localhost DEV environment on MacOS using Homebrew, to run WordPress (or any other PHP powered web-app) locally.
Installing Local, MAMP or other local server environments for testing and development may be an overhead if you just need a plain-vanilla web server that can be kept up-to-date easily.
⚠️ Before proceeding, please make sure that you’re using the latest MacOS version. Windows users should install a preconfigured DEV environment like XAMPP, MAMP for Windows or WampServer – if you feel comfortable you can try to setup Homebrew via Windows Subsystem for Linux (WSL). Linux users need to follow the official Homebrew on Linux guide and will have to change some file paths accordingly.
MacOS
Prerequisites
Visual Studio Code Visual Studio Code has become the de-facto standard in web development but any pre-installed editor will be sufficient.
Terminal MacOS app to perform shell commands. Any code snippet below starting with $ needs to be executed via a Terminal Emulator.
Homebrew Package manager for MacOS/Linux that helps you install the latest software packages for your localhost environment and automatically launches required processes when you start your system. Outdated packages can be updated with a single command.
WordPress Content Management System powered by PHP.
PHP is a popular general-purpose scripting language that is especially suited to web development. Fast, flexible and pragmatic, PHP powers everything from your blog to the most popular websites in the world.
MariaDB Community Server sets the standard for open source relational databases, with Oracle Database compatibility (e.g., sequences and PL/SQL), temporal tables, transparent sharding, instant schema changes, point-in-time rollback and modern SQL (i.e., common table expressions, window functions, JSON functions and more).
⚠️ “Localhost” is just a suggestion and you can choose whatever folder name you prefer.
Configure the database
Change the root password and create a new empty database for WordPress.
$ sudo mysql
$ ALTER USER 'root'@'localhost' IDENTIFIED BY '{NEW_PASSWORD}';
⚠️ The password is required to access the database and you’ll need it later – store the access credentials (Username “root” + chosen password) in your password manager or write it down somewhere.
$ CREATE DATABASE wordpress;
⚠️ You are free to choose a different database name.
Configure the web server
‼️ Find the default Apache configuration file in /opt/homebrew/etc/httpd/httpd.conf (on Mac computers with Apple silicon) or in /usr/local/etc/httpd/httpd.conf (on Mac computers with Intel processors), create a backup (e.g. httpd_backup.conf) and open httpd.conf in a text editor.
Uncomment or adapt the following lines and save the changes afterwards:
Download and extract the latest WordPress Core ZIP in an arbitrary Localhost directory (e.g. /{YOUR_USERNAME}/Localhost/wordpress), access http://localhost/wordpress/wp-admin/install.php and follow the setup guide by entering the database credentials defined earlier.
Some recommended tools that may make your WordPress developer life easier are Multisite Network (Maintain multiple sites on a single WordPress installation), Composer (PHP package manager), WP-CLI (Command-line interface for WordPress), phpMyAdmin or Adminer (Database management tools) and PHP Code Sniffer (PHP code quality and coding standards) in combination with the WordPress Coding Standard rules.
It’s strongly advised to always update to the latest software versions available.
$ brew update && brew cleanup
$ brew upgrade
Yes, you can use this local server to run other applications besides WordPress!
Feel free to install and setup any web tool that’s powered by PHP (and MySQL/MariaDB) on your new localhost environment. In addition to WordPress, covered in this post, some other popular applications you can use, include:
Drupal (Content Management System)
TYPO3 (Content Management System)
Joomla (Content Management System)
Nextcloud (Private Cloud server)
Magento (E-Commerce)
Matomo (Web analytics)
MediaWiki (Wiki software)
… just to name a few
That’s all for now
The instructions may be updated from time to time to reflect any OS specific changes. If you have questions, recommendations or just would like to say ❤️ Thank you, post a comment below.
Hello,
I’ve just deployed a page to the production server where npm is not present, and I prefer not to have it there. I’m wondering how to address the issue when making changes locally and uploading those changes (main.scss) doesn’t reflect any modifications on the production server. Is there a specific workaround or something I need to do to resolve this?
If you have a basic understanding of frontend development, which is mandatory when working with a WP Starter theme, you should know that only the locally created build/dist files are relevant on production. main.scss is never touched or enqueued via the website: https://them.es/starter-bootstrap/getting-started/
I’ve integrated the theme as instructed, but I’m getting these errors in the console. It doesn’t appear to be affecting the “watch” script as changes are taking place, but any thoughts on how I can fix this to keep it from flooding my console? I’m not too familiar w/ WebPack. Any direction is most appreciated. Thanks.
Thanks for the detailed information including relevant screenshots.
A similar issue has never been reported and it seems to be related to the webpack DevServer config. Here you can find all possible configuration settings: https://webpack.js.org/configuration/dev-server/
To fix it, I would start tinkering with the one’s related to “WebSocket”.
client: {
webSocketURL: '{ADD YOUR LOCAL WS URL HERE}',
},
Maybe unrelated, but I noticed that you’re using a wss:// protocol (= WebSocket SSL connection) which is unusual on localhost systems as you’d have to provide a valid SSL certificate.
I’ve tried different combinations of the config settings, as well as your above recommendations without success.
You may be on to something regarding the SSL certificate. When inspecting in Safari, the console expresses an “An SSL error has occurred and a secure connections to the server cannot be made.” regarding the WebSocket connection – while in Chrome, it just says the connection failed seen in the OG screenshots.
I spun up another host following your instructions in case I missed anything:
Uploaded and activated the new theme in WordPress
“npm install” in the console
“npm run watch” to start webpack
The instance uses wss:// protocol to begin with without me changing anything. Is there a way to start using just the ws:// protocol and potentially avoiding that error?
I’m using MAMP Pro to spin up the WordPress instance, which installs an SSL certificate for the site, but not sure that has anything to do with the WebSocket SSL.
When disabling the SSL certificate for WordPress, the WebSocket errors resolve, but then I get I get “[webpack-dev-server] Invalid Host/Origin header” errors in both browsers.
I’ve implemented the allowedHosts option and targeted my local.mopqc host, which removes the Invalid Host/Origin error, but now causes an infinite “App Updated. reloading…” loop. I haven’t found a solution when combing the web, so at this point I’m keen to just ignore it or switch starter themes altogether. I appreciate your help regardless, but this remains unresolved.
Sorry about that and good luck anyway.
Maybe the MAMP support team https://www.mamp.info/en/mamp-pro/support/ has experience in setting up a working webpack-dev-server config?
Otherwise you’d have to consult a webpack expert who could help you fix the infinite reloading issue. One last try: Try to add your IP address, incl./excl. the port, instead of your local URL (in your case probably via the webSocketURL configuration), as stated here: https://github.com/webpack/webpack-dev-server/issues/4232#issuecomment-1588507348
Your Bootstrap theme, simple and straightforward, used to work like a charm. Now it’s a pain in the **s to install and configure, it’s clunky as hell and takes hours to debug in VScode and Flywheel. Why guys?!
theme is the latest Bootstrap theme available on your site
MacOS Sonoma, Flywheel local Version 8.1.0+6514, PHP 8, Apache, MySQL 8.0.16, npm 10.2.4, webpack 5.89.0
Wordpress 6.4.1
No plugin yet, project is blank
Our main problem is it worked well… with Gulp. It’s much more complicated to have it work between flywheel & webpack, the whole process is quite confusing to say the least
Well, we don’t force you to use the new webpack config which, by the way, is much leaner and at the same time more future proof because it makes use of a WordPress internal configuration file.
Feel free to implement the old Gulp setup if it better suits your specific needs.
The weird thing is that webpack already has been implemented in the past for bundling the JS files. And webpack or any frontend assets are completely independent from the server setup (i.e. Local “Flywheel”).
You could play around with the webpack config and for instance change the mode setting to "development". This should speed up compile time but you would have to rebuild the assets for production before deploying them live.
Probably there is always room for improvements in the current webpack configuration. Pull requests are welcome!
I was using Ekko Lightbox with the Bootstrap 4* theme, but since updating to Bootstrap 5 it is no longer supported.
I’ve tried using the Lightbox for Bootstrap 5, but I can’t seem to get it to work. I tried on a clean them install with no other plug ins and still nada….
Hi leebaz,
sorry to read that you’re having trouble with your site but please understand that we can’t provide support for third-party tools.
You could ask for help in the Github repo you referred to: https://github.com/trvswgnr/bs5-lightbox/issues
As an alternative solution there are several ready-to-use Lightbox plugins in the WordPress Plugins directory which may be worth a try: https://wordpress.org/plugins/search/lightbox
We’re happy to announce that our Support Forum has been relaunched with a custom-built Theme based on our FSE Starter Block Theme (OpenSource, GPL2+).
Why the change?
When them.es/Support went live in 2015, we decided to set it up with the (now deprecated) P2 “Breathe” Theme and its companion, the o2 Plugin.
All in all it worked very well for years and we even managed to extend it according to our needs by using a Child theme. But recently the efforts to ensure compatibility with the latest WordPress and PHP versions have become quite a burden. Monkey patches 🙈 had to be applied to work around issues — and this is bad practice for obvious reasons.
Also, relying on code that is not maintained anymore was a no-go.
While evaluating existing Forum plugins and similar solutions it soon turned out that they all lack important features and could not be customized in a way that was satisfying. Putting the code base again in a dependence on third-party software with an unclear future was another no-go.
So we decided to go all-in and to develop our own tailored Support Theme. Thanks to the Gutenberg plugin and its new Interactivity API which currently is in active development, all requirements could be fulfilled without compromise.
What changed?
From a user-perspective not much changed at all, as all previous features like Search autocomplete, Frontend posting, File uploading and Marking requests as resolved, have been incorporated.
Besides the new foundation which reduced the code footprint to an absolute minimum, we polished the design a bit and added a better UX with interactive elements.
Furthermore users now can format their posts with basic Markdown syntax, if needed.
As a nice side effect the overall page loading performance has improved a lot.
Of course a re-release that makes use of a newish approach with bleeding-edge features may contain bugs and we kindly ask everyone to consider this site “Beta” for the time being. It’s quite possible that things get out of order or even break.
If you notice some hiccups or errors, please let us know, by commenting below, so that we can fix it. And if you miss something essential, we always keep the door open for feature-requests. Please mention why you are requesting it and what problem it may solve.
Hopefully you like the new Support Forum as much as we do.
Hi, i have error on my console and I have error in my terminal when I run npm run watch
“WARNING in asset size limit: The following asset(s) exceed the recommended size limit (244 KiB).
This can impact web performance.
Assets:
main.css (284 KiB)
WARNING in entrypoint size limit: The following entrypoint(s) combined asset size exceeds the recommended limit (244 KiB). This can impact web performance.
Entrypoints:
main (484 KiB)
main.css
main.js
main.asset.php
WARNING in webpack performance recommendations:
You can limit the size of your bundles by using import() or require.ensure to lazy load some parts of your application.
For more info visit https://webpack.js.org/guides/code-splitting/
”
We’ve received feedback from our community that the now retired build workflow (using Gulp and/or webpack to generate the CSS/JS assets) included several package vulnerabilities that have not been fixed for quite a while and obviously have become unmaintained by the creators.
One could argue that this should not be problematic, as these dependencies only affect the local development system – and as long as the build process still works, there’s no need to change a running system.
But using obsolete and unsupported software can be dangerous and can break things “overnight”. Not to mention potential security risks that may arise in the web development stack.
So it was necessary to find a new simple, modern and future-proof build process for SASS-CSS compilation and JS-bundling…
Fortunately the research did not take too long. The @wordpress/scripts package from the awesome Gutenberg community already comes with a proven and tested webpack configuration specific to WordPress development, which made it a perfect candidate to try out.
After some trial-and-error, the new build workflow worked pretty well and that’s why we decided to roll it out to all our Starter Themes (Full Site Editing, Bootstrap and Material Design) and include this new setup exclusively, meaning that Gulp (including its internal dependencies) is not needed anymore.
Start the development process: $ npm run watch Build and minify the assets: $ npm run build
👆 Breaking change: Theme build directories have been moved from /assets/css and /assets/js to /build which aligns with the @wordpress configuration. If you want to include the new workflow in an existing theme, please have a look at the source code in the Github repositories of the Starter Theme and adjust the paths of the JS/CSS assets in functions.php accordingly. On the other hand, if you want to keep the old workflow, feel free to keep it as long as it works on your side.
Hi Janos, thanks for your interest in purchasing a Billy PRO license. Basic multilingual support has been integrated in the…