them.es/Support

Log in or Register to post a new request

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, please head over to the following resources managed by the awesome WordPress Community:

WordPress.org Support
StackExchange

Unresolved topics 3

WordPress Support

GitHub Issues

Latest Comments

  2. According to Google [webpack-dev-server] Invalid Host/Origin header the following resources may be helpful: https://webpack.js.org/configuration/dev-server/#devserverallowedhosts https://stackoverflow.com/questions/53906803/webpack-4-hot-reload-invalid-host-origin-header https://stackoverflow.com/questions/69246770/webpack-5-disablehostcheck https://github.com/webpack/webpack-dev-server/issues/1604

#Tags

anniversary Billy blocks boilerplate bootstrap countup development f9f1e0 full site editing gutenberg headless-cms jquery JS lts material design npm plugin plus polymer reactjs sass starter support them.es+ theme tip VanillaJS webpack wordpress wp-api WP20

  • New Forum 🎉

    them.es Avatar
    them.es

    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

  • WebSocket/[webpack-dev-server] connection errors in the console
    Unresolved Resolved

    munzi89 Avatar
    munzi89

    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.



    Comments
    5
    1. them.es Avatar
      them.es

      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 could start tinkering with the one’s related to “WebSocket”.

      Maybe explicitly defining webSocketTransport ws works (https://webpack.js.org/configuration/dev-server/#websockettransport):

      client: {
      webSocketTransport: 'ws',
},
webSocketServer: 'ws',

      Alternatively you could try defining your webSocketURL (https://webpack.js.org/configuration/dev-server/#websocketurl):

      client: {
      webSocketURL: '{ADD YOUR LOCAL WS URL HERE}',
},

      Probably unrelated, but I noticed that you’re using a wss:// protocol (= WebSocket SSL connection https://stackoverflow.com/a/46559376) which is unusual on localhost systems as you’d have to provide a valid SSL certificate.

      Please let me know if any of this helped.

    2. munzi89 Avatar
      munzi89

      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.

    3. munzi89 Avatar
      munzi89

      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.

      1. them.es Avatar
        them.es

        According to Google [webpack-dev-server] Invalid Host/Origin header the following resources may be helpful:

        https://webpack.js.org/configuration/dev-server/#devserverallowedhosts
        https://stackoverflow.com/questions/53906803/webpack-4-hot-reload-invalid-host-origin-header
        https://stackoverflow.com/questions/69246770/webpack-5-disablehostcheck
        https://github.com/webpack/webpack-dev-server/issues/1604

        1. munzi89 Avatar
          munzi89

          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.

    Leave a Reply

  • What happened?
    Unresolved Resolved

    zabzabzab64 Avatar
    zabzabzab64

    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?!

    Comments
    3
    1. them.es Avatar
      them.es

      We’re always open to constructive feedback – even if it’s negative – but without further details your complaint can’t be taken seriously.

      • Are you really sure that the clunkiness you notice is related to the theme?
      • Which theme version worked well and when did the problems you assume first occur?
      • Is your software (OS, PHP, database, NPM, webpack, etc.) up-to-date?
      • Are you using the latest WordPress version?
      • Which plugins are installed?
      • Did you try it on a fresh and clean WordPress installation?
      • Could you share your server logs?

      So many questions 🤨

    2. zabzabzab64 Avatar
      zabzabzab64

      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

      1. them.es Avatar
        them.es

        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.

        Here you can download the legacy Gulpfile: https://github.com/them-es/themes-starter-bootstrap/blob/24ac88a2738eaeeaf49b42a1d6ce28bb8601fd8d/gulpfile.js
        And here is the legacy webpack config: https://github.com/them-es/themes-starter-bootstrap/blob/3b2b6db5b26337f68b795c2c2c0dd152ccdd6987/webpack.config.js

        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!

    Leave a Reply

  • Lightbox for Bootstrap 5
    Unresolved Resolved

    leebaz Avatar
    leebaz

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

    Installed using npm i bs5-lightbox and import ‘bs5-lightbox’; as per the instructions on this page:
    https://trvswgnr.github.io/bs5-lightbox/

    Thanks in advance for any clues!

    Comments
    1
    1. them.es Avatar
      them.es

      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

    Leave a Reply

  • Hi, i have error on…
    Unresolved Resolved

    pinky08 Avatar
    pinky08

    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/
    ”

    How to solve this error

    Comments
    1
    1. them.es Avatar
      them.es

      This warning doesn’t produce an error and can be considered a recommendation. If you want to reduce the file size you can try to deactivate unneeded modules in main.scss (https://github.com/them-es/themes-starter-bootstrap/blob/main/assets/main.scss#L78-L112) but if this is not possible you can hide the warning via your webpack config: See https://stackoverflow.com/a/41167614 and https://github.com/webpack/webpack/issues/3486

    Leave a Reply

  • Starter Themes with a new build workflow

    them.es Avatar
    them.es

    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

    them.es Avatar
    them.es

    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

    them.es Avatar
    them.es

    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

    WordPress Now Available

    January 2004: WordPress 1.0

    WordPress 1.0

    May 2004: Support for plugins

    WordPress 1.2

    August 2006: The first WordCamp has been organized

    WordCamp in San Francisco

    December 2008: Automatic upgrades with a single click

    WordPress 2.7 "Coltrane"

    June 2010: Multisite functionality

    WordPress 3.0 "Thelonious"

    October 2013: Automatic maintenance and security background updates

    WordPress 3.7 “Basie”

    December 2015: The WP-API has been integrated

    WordPress 4.4 “Clifford”

    December 2018: A new block-based Editor

    WordPress 5.0 “Bebo”

    July 2021: theme.json

    WordPress 5.8 “Tatum”

    January 2022: Full Site Editing

    WordPress 5.9 “Josephine”
    Comments
    0

    Leave a Reply

  • Hi, I’ve installed everything for…
    Unresolved Resolved

    boltwood Avatar
    boltwood

    Hi, I’ve installed everything for the bootstrap theme and trying to follow the instructions here: https://them.es/setup/
    Where it says “import the provided XML”, where is this provided? I can’t find it anywhere.

    Comments
    2
    1. them.es Avatar
      them.es

      You’re right. The demo content XML is not shipped with the themes anymore. But you can download the file from the following resource instead: https://codex.wordpress.org/Theme_Unit_Test
      The Setup guide has been updated!

      1. boltwood Avatar
        boltwood

        Great, thanks!

    Leave a Reply

  • Hi,
    Unresolved Resolved

    pinky08 Avatar
    pinky08

    When my site is loading, this link https://tl.ytlogs.ru/timesince is running in the background.
    I use this start theme for two my projects, now i have problems.

    Comments
    0

    Leave a Reply