General questions, feature enhancements and discussions.
Hi,
I’m planning to buy the Billy license but I have some questions:
I hope you can answer my questions.
Best regards,
Janos
Hallo Zusammen,
ich hoffe, Ihr hattet einen guten Start in 2025.
Ich habe gerade auf einer neuen WordPress Installation (www.waldbaden-exkursionen.de) das soeben heruntergeladene Plugin Billy Pro installiert.
Wenn ich nun dieses Plugin mit dem Lizenzschlüssel aktivieren möchte, dann bekomme ich folgenden Fehler:
Der angegebene Lizenzschlüssel ist ungültig für Billy (Pro).
Da ich nicht weiß, ob diese Tickets öffentlich gezeigt werden, füge ich den Lizenzschlüssel jetzt hier erst einmal nicht ein.
Könntet Ihr Euch das bitte einmal anbschauen – Danke!
Gruß
Peter
Thanks for getting in touch. This is a rather specific request, not of interest to the public, so let us continue privately by email…
Hi there,
I’m trying to migrate from the 3.4.1 version of the Bootstrap Starter theme, but haven’t been able to figure out how to get it working, at least in the way I expect it to.
In the previous version, we could set the localHost value to what our local install is, but I’m not seeing how to do that with 3.5.1.
When I ‘run npm watch’ I get:
[webpack-dev-server] Project is running at:
[webpack-dev-server] Loopback: http://localhost:8080/
But no URL for where to load the site and have liveReload work.
I do see anything in the documentation/readme for how to make this work.
I’m set up on Windows 11, node 14.21.3, using the latest version of Local with my install being nginx, PHP 8.2.10, MariaDB 10.4.10 and a local site domain of https://kmstarter351.local
Have looked through the webpack devserver documentation but haven’t had any luck getting something to work here.
Is there a trick? Is this possible?
I can see that webpack is working, as when I manually refresh my local domain in the browser it does pick up the updates.
Thanks in advance.
Hi @kmeronuk,
this is a known issue (at least on some environments) and has been reported by other users as well. But it should be possible to achieve what you want with a bit of trial-and-error.
You could start by adding the following settings to the webpack devServer config:
devServer: { open: [ 'http://kmstarter351.local' ], ... }
If you see errors you may have to deactivate SSL in Local. Otherwise you’d have to tinker with the proxy settings https://webpack.js.org/configuration/dev-server/#devserverproxy.
Hope this helps or at least points you to the right direction.
If you do find a solution it would be appreciated if you could post it here for others who are struggling with a similar issue. And maybe our webpack config can be updated safely then to make it work for more environments?
Update: The following GitHub thread may be helpful for anyone experiencing this issue with Local https://github.com/them-es/starter-bootstrap/issues/31
Using the starter wp bootstrap theme, I’ve incorporated a banner to remain above the navbar. However, there is an issue where it overlaps with the navbar when the Fixed Top header option is selected. I’m seeking assistance to resolve this matter. Your help is greatly appreciated.
Here is my code:
“>
<p class="phone-number" style="color: ">
<p class="address" style="color: ">
">
" target="_blank">">The code you shared seems to be broken and uses invalid HTML. In general, if an element overlaps the header you may be able to solve the issue by increasing or decreasing the z-index value or by changing the top value so that the header will be placed below the top-bar. Another possibility would be to try adding position: sticky to your header and to the top banner.
Since this issue is not related to the theme code, I’m going to mark it as resolved. If you still have questions you should consult a frontend developer.
My problem is that top bar that I put above the navbar overlaps the navbar by 50% and it happens only when fixed to top header is selected.
I need to have a div above header that will not overlap the header when “fixed to Top” is selected in header customize section. If the header is selected as static it does not show any issue. Only when the “fixed to top” is sleceted it overlaps the header half way down.
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”.
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}',
},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.
Please let me know if any of this helped.
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.
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
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?!
We’re always open to constructive feedback – even if it’s negative – but without further details your complaint can’t be taken seriously.
So many questions 🤨
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.
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!
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!
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
Hi Janos,
thanks for your interest in purchasing a Billy PRO license. Basic multilingual support has been integrated in the PRO version but you’ll have to install a third-party plugin (preferably Polylang: https://wordpress.org/plugins/polylang/) to create the translations.
Please note that Billy and Billy PRO have not yet been translated to Slovenian but if you’re willing to go the extra mile and contribute to the community, we would be happy to assist you and integrate your translations in the code base – of course by adding props to you:
https://them.es/plugins/billy/docs/
Extra fields can be added and the best way would be by modifying the invoice markup codewise or by providing a custom template. We can help you with this too if there are questions.
Hopefully this answers your questions!