Frontend Toolbars
-
Hi,
Do you have any documentation on how the frontend toolbars are working. I enabled this plugin and the backend admin looks great, but on the front-end I can still see the old WP toolbar, which breaks the experience.
I tried creating one myself in the UI-Builder but then the front-end loads with no admin bar across the top at all.Thank you
-
Hey,
We don’t have any documentation right but we are going to create a video on this feature soon. It should work just as the uiTemplates though, create what you want on the frontend to replace the toolbar and apply to roles. However compatibility can’t be guaranteed because of the vast differences between themes.
I have attached a frontend template that you can try out if you like and see if it works for you.
https://uipress.co/wp-content/uploads/2023/03/uip-ui-template-Toolbar-03-22-2023.json_.zip
Thanks,
Mark
Hi Mark,
Thank you for your reply, and for the template. I tried it and it’s similar to what I thought initially.But the front end still loads without an admin bar. I think this may be a bug.
In terms of themes, I am using Elementor Hello 2.6.1 together with Elementor and Elementor Pro.I don’t see any console errors, but I do get a toaster notification saying “TypeError: Cannot use ‘in’ operator to search for ‘options’ in”
No PHP Errors either…
Not sure if this is related, but the dropdowns do not seem to work correctly. For example: in the admin section if I want to create a new page using the top menu link, if I hover over “new”, nothing happens. If I click on “New”, the dropdown opens but it takes me to create a new post. I noticed the same thing happens if I launch a new demo on uipress.co.
I have tested with elementor pro and the hello theme and it is working on my end. Regarding the toast notification, that should still print to the console (it won’t be red) but should be there, can you paste what is says in full?
Re Dropdowns, is this in the wp toolbar block? If so then we are aware of this and working on a fix!
Mark
Hi Mark, you’re right, I found it logged as an info message, I was filtering for errors by default.
The message reads:
TypeError: Cannot use 'in' operator to search for 'options' in at Proxy.returnFavicon (uip-pro-favicon.min.js?version=307:1:226) at fe.run (vuejs.min.js?ver=3.1.0:1:5560) at get value [as value] (vuejs.min.js?ver=3.1.0:1:13792) at Object.get [as returnFavicon] (vuejs.min.js?ver=3.1.0:1:33138) at Object.get (vuejs.min.js?ver=3.1.0:1:31316) at Proxy.getFavicon (uip-pro-favicon.min.js?version=307:1:500) at Proxy.render (eval at ou (vuejs.min.js?ver=3.1.0:1:120024), <anonymous>:9:29) at mn (vuejs.min.js?ver=3.1.0:1:17353) at fe.fn (vuejs.min.js?ver=3.1.0:1:48617) at fe.run (vuejs.min.js?ver=3.1.0:1:5560)
Sorry forgot about the second part of the message :D, yes it is re. the drop downs on the toolbar element. Happy to hear you are aware of it π
Thanks for sharing the debug, I am not sure what is causing this as it’s not happening on our setups but I have added a catch for it in the next release which should fix the problem.
Amazing thank you so much!
Version 3.1.1 was just released and contains what I believe should fix your issue. When you have updated, make sure to clear cache and then check if it’s working. If it’s not let us know and we will investigate more
Hi Mark,
Thank you for the quick update. V 3.1.1 fixes the issue with the toolbar dropdowns π₯³, but I am still getting the same errors with the admin-bar on the front-end.
I tried in safari as well and got the following displayed on the front-end (via toaster message):TypeError: “” is not an Object. (evaluating ‘”options”in this.uiTemplate.globalSettings
Console in Safari says:
TypeError: "" is not an Object. (evaluating '"options"in this.uiTemplate.globalSettings')
returnFavicon β uip-pro-favicon.min.js:1:230
returnFavicon
run β vuejs.min.js:1:5563
value β vuejs.min.js:1:13796
get β vuejs.min.js:1:33138
get β vuejs.min.js:1:31317
getFavicon β uip-pro-favicon.min.js:1:500
getFavicon
render
mn β vuejs.min.js:1:17358
(anonymous function) β vuejs.min.js:1:48620
run β vuejs.min.js:1:5563
P β vuejs.min.js:1:48896
R β vuejs.min.js:1:47331
F β vuejs.min.js:1:45494
h β vuejs.min.js:1:42593
w β vuejs.min.js:1:43876
O β vuejs.min.js:1:45241
h β vuejs.min.js:1:42529
w β vuejs.min.js:1:43876
O β vuejs.min.js:1:45241
h β vuejs.min.js:1:42529
(anonymous function) β vuejs.min.js:1:48625
run β vuejs.min.js:1:5563
P β vuejs.min.js:1:48896
R β vuejs.min.js:1:47331
F β vuejs.min.js:1:45494
h β vuejs.min.js:1:42593
w β vuejs.min.js:1:43876
O β vuejs.min.js:1:45241
h β vuejs.min.js:1:42529
w β vuejs.min.js:1:43876
O β vuejs.min.js:1:45241
h β vuejs.min.js:1:42529
w β vuejs.min.js:1:43876
O β vuejs.min.js:1:45241
h β vuejs.min.js:1:42529
(anonymous function) β vuejs.min.js:1:48625
run β vuejs.min.js:1:5563
P β vuejs.min.js:1:48896
R β vuejs.min.js:1:47331
F β vuejs.min.js:1:45494
h β vuejs.min.js:1:42593
(anonymous function) β vuejs.min.js:1:48625
run β vuejs.min.js:1:5563
P β vuejs.min.js:1:48896
R β vuejs.min.js:1:47331
F β vuejs.min.js:1:45494
h β vuejs.min.js:1:42593
Q β vuejs.min.js:1:53755
mount β vuejs.min.js:1:38030
(anonymous function) β vuejs.min.js:1:120638
(anonymous function) β uip-app.min.js:1:4647
promiseReactionJobon Chrome it’s still saying:
TypeError: Cannot use ‘in’ operator to search for ‘options’ in with the same console error.
Sorry, I should have mentioned the error you have is coming from the pro version which was also updated and should be v3.0.8 now – is it still present with the latest pro?
Thank you, I see the error now mentions:
TypeError: Cannot use 'in' operator to search for 'options' in at Proxy.returnTitle (uip-pro-site-title.min.js?version=308:1:325) at fe.run (vuejs.min.js?ver=3.1.1:1:5560) at get value [as value] (vuejs.min.js?ver=3.1.1:1:13792) at Object.get [as returnTitle] (vuejs.min.js?ver=3.1.1:1:33138) at Object.get (vuejs.min.js?ver=3.1.1:1:31316) at Proxy.getSiteTitle (uip-pro-site-title.min.js?version=308:1:599) at Proxy.render (eval at ou (vuejs.min.js?ver=3.1.1:1:120024), <anonymous>:9:29) at mn (vuejs.min.js?ver=3.1.1:1:17353) at fe.fn (vuejs.min.js?ver=3.1.1:1:48617) at fe.run (vuejs.min.js?ver=3.1.1:1:5560)
Before it had an issue with favicon.min.js
I found that you added this check on the favicon file:
returnFavicon() { if (!this.uipress.isObject(this.uiTemplate.globalSettings)) { return false; }
So I added it on the beginning of the returnTitle function in the uip-pro-site.js and .min.js file.
The error is now gone, but the template is still not loading on the front end…
Hello, yes we have added a catch to that script now too for the next release.
I think the bigger problem here is that uiTemplate.globalSettings object isn’t there and likely explains why your template isn’t loading / accessible.
Have you tried disabling all other plugins to see if this is a plugin conflict?
Hello, I am closing this ticket now due to inactivity but feel free to open a new ticket if you are still having issues!
Thanks,
Mark
- The topic ‘Frontend Toolbars’ is closed to new replies.