Likes

  • Localhost DEV environment for WordPress

    This tutorial helps you set up a basic localhost DEV environment on MacOS using Homebrew, to run WordPress (or any […]

  • 25,000

    The new year starts great! A major milestone has been reached – our Bootstrap Starter Theme for WordPress was downloaded […]

  • New Forum 🎉

    We’re happy to announce that our Support Forum has been relaunched with a custom-built Theme based on our FSE Starter […]

  • <i> Toolbar for WordPress

    Our latest WordPress Plugin Directory addition integrates the awesome Bootstrap Icons (MIT) library in the WordPress rich-text toolbar without requiring […]


  • 25,000

    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…


    Comments
    0

    Leave a Reply

  • Billy has been refactored

    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?


    Comments
    0

    Leave a Reply

  • Localhost DEV environment for WordPress

    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.
    • XCode Command line tools
      Required by Homebrew.
    • 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.

    XCode Command Line Tools

    $ xcode-select --install

    (Alternatively you can download and install XCode directly: https://apps.apple.com/us/app/xcode/id497799835)

    Install Homebrew

    $ /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

    (Alternatively you can download and install the following .pkg file: https://github.com/Homebrew/brew/releases)

    $ brew doctor

    😀 Your system is ready to brew.

    Install Apache web server

    The Apache HTTP Server “httpd” is the most popular web server on the Internet.

    httpd.apache.org

    First, make sure that any running internal Apache server has been stopped and unloaded from the launch processes:

    $ sudo apachectl -k stop

    $ sudo launchctl unload -w /System/Library/LaunchDaemons/org.apache.httpd.plist 2>/dev/null

    Now you can install and launch the new server:

    $ brew install httpd

    $ brew services start httpd

    Install 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.

    php.net

    $ brew install php

    $ brew services start php

    Install MariaDB

    MariaDB has been forked from MySQL and is highly backwards compatible.

    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).

    mariadb.com

    $ brew install mariadb

    $ brew services start mariadb

    Test the status of each service

    $ brew services

    NameStatusUserFile
    httpd started{YOUR_USERNAME}~/Library/LaunchAgents/homebrew.mxcl.httpd.plist
    mariadbstarted{YOUR_USERNAME}~/Library/LaunchAgents/homebrew.mxcl.mariadb.plist
    phpstarted{YOUR_USERNAME}~/Library/LaunchAgents/homebrew.mxcl.php.plist

    If something is wrong you can try to restart the service(s).

    $ brew services restart httpd

    $ brew services restart mariadb

    $ brew services restart php

    Setup your server directory

    Create a new folder in your user directory and execute the following commands. You will also create two debug info pages that may be helpful:

    $ mkdir ~/Localhost
    $ echo "<h1>It works!</h1>" > ~/Localhost/index.html
    $ echo "<?php phpinfo();" > ~/Localhost/phpinfo.php

    ⚠️ “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:

    BeforeAfter
    ServerRoot "/opt/homebrew/opt/httpd"ServerRoot "/opt/homebrew/opt/httpd"
    AddDefaultCharset UTF-8


    ⚠️ The /homebrew path may differ depending on your system (‼️)
    Listen 8080Listen 80
    # LoadModule vhost_alias_module lib/httpd/modules/mod_vhost_alias.soLoadModule vhost_alias_module lib/httpd/modules/mod_vhost_alias.so
    # LoadModule rewrite_module lib/httpd/modules/mod_rewrite.soLoadModule rewrite_module lib/httpd/modules/mod_rewrite.so
    LoadModule php_module /opt/homebrew/opt/php/lib/httpd/modules/libphp.so


    ⚠️ The /homebrew path may differ depending on your system (‼️)
    User _www
    Group _www
    User {YOUR_USERNAME}
    Group staff


    ⚠️ Insert your MacOS username
    DocumentRoot "/opt/homebrew/var/www"
    <Directory "/opt/homebrew/var/www">

    AllowOverride None
    DocumentRoot "/{YOUR_USERNAME}/Localhost"
    <Directory "/{YOUR_USERNAME}/Localhost">

    AllowOverride None

    ⚠️ Insert your MacOS username and use the directory you defined earlier
    <IfModule dir_module>
    DirectoryIndex index.html
    </IfModule>
    <IfModule dir_module>
    DirectoryIndex index.php index.html
    </IfModule>
    # PHP settings
    Include /opt/homebrew/etc/httpd/extra/httpd-php.conf


    ⚠️ The /homebrew path may differ depending on your system (‼️)
    ⚠️ Append this text at the bottom of the file

    It works!

    Open http://localhost – if you see the notice “It works!“, the local server is up and running 👏

    Now open http://localhost/phpinfo.php and check the PHP server info. The page should look like this, stating the current PHP version.

    Install and setup WordPress

    Finally it’s time to run the WordPress install script.

    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.

    Finish the installation by setting the WP user credentials and by logging in to WordPress: http://localhost/wordpress/wp-login.php

    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.

    Are you using one of our WordPress Starter Themes? Feel free to install node.js/npm via Homebrew to consolidate all development tools and build processes in one place.

    Keep all Homebrew packages up-to-date

    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.


    Comments
    0

    Leave a Reply

  • New Forum 🎉

    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.


    Comments
    0

    Leave a Reply

  • Starter Themes with a new build workflow

    We’ve received feedback from our community that the old 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 the frontend assets
    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 build process worked pretty well and that’s why all our Starter Themes (Full Site Editing, Bootstrap and Material Design) have been updated to include this “webpack only” workflow from WordPress. From now on Gulp (including its several internal dependencies that are outdated) is not needed anymore.

    Start the development process:
    $ npm run watch
    Build and minify the assets:
    $ npm run build

    👆 Breaking change: The 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.


    Comments
    0

    Leave a Reply

  • WordPress Playground

    Would you like to play around with an instant WordPress installation that runs in your browser?

    Visit https://them.es/playground [🪄 powered by playground.wordpress.net] and give it a try.

    Quickly demonstrate the WordPress dashboard to interested people or temporarily test Themes and Plugins without the need of an entire web server:


    Comments
    0

    Leave a Reply

  • 20 years WordPress

    Today our favorite CMS celebrates its 20th anniversary 🎉. A special website dedicated to this event has been established by the WordPress team:

    What started as a way to make a better blogging experience has grown into a vibrant open source project that powers an ever-growing percentage of the world’s websites.

    https://wp20.wordpress.net

    Let’s commemorate some historic milestones, the WordPress project passed within two decades:

    May 2003: WordPress 0.7 – The first release

    January 2004: WordPress 1.0

    May 2004: Support for plugins

    August 2006: The first WordCamp has been organized

    December 2008: Automatic upgrades with a single click

    June 2010: Multisite functionality

    October 2013: Automatic maintenance and security background updates

    December 2015: The WP-API has been integrated

    December 2018: A new block-based Editor

    July 2021: theme.json

    January 2022: Full Site Editing


    Comments
    0

    Leave a Reply

  • npm “global” packages

    If you manage multiple themes with similar npm dependencies you should install npm packages globally and link them in your theme directories. First of all this saves a lot of disk space. But it also disburdens the upgrade process of development frameworks and toolkits that are used across projects.

    1. Install packages globally by adding the “-g” flag:
    $ npm install -g package_1 package_2 package_3 package_4 etc.

    2. Link the packages in your local theme directory/directories:

    Bootstrap-Theme
    $ npm link bootstrap @popperjs/core ...

    Material-Theme
    $ npm link material-components-web ...

    FSE-Theme
    $ npm link autoprefixer css-loader sass sass-loader ...

    Happy Coding!


    Comments
    0

    Leave a Reply

  • <i> Toolbar for WordPress

    Our latest WordPress Plugin Directory addition integrates the awesome Bootstrap Icons (MIT) library in the WordPress rich-text toolbar without requiring any coding experience. Just the way it should be.

    • 1300+ pixel perfect webfont icons
    • Small filesize
    • Easy WYSIWYG integration: No Shortcodes!
    • Privacy by design: No CDN hosted files!
    • Autofilter

    You can download it from the WordPress Plugin Directory:

    Of course <i> Toolbar makes a great addition to our Bootstrap Starter Theme but since the Bootstrap library is not required and the plugin has no dependencies it will work with any other theme like our Material Starter Theme and our Full Site Editing Starter Theme.


    Comments
    0

    Leave a Reply

  • Emoji Picker for WordPress

    A working and maintained Emoji Picker Plugin has been brought back to WordPress. Easily add Emojis from any rich-text block like Paragraphs, Headings, Lists, etc. without leaving the Editor.

    Emojis are pictograms used in instant messengers, forums and web pages to reflect emotions. They have become so popular that Oxford Dictionaries has named “😂” word of the year 2015.

    Nowadays all browsers and operating systems support the Emoji characters. When picking your Emojis from the Emoji Toolbar they will be added in raw format so no images are loaded on the frontend.


    Comments
    0

    Leave a Reply