Ever since I started using WordPress I’ve appreciated the power of shortcodes. But there has been one thing (well two things) about the visual editor of WordPress that has always niggled away at me.
Its having to use shortcodes for some really simple visual elements, and even more than that, not being able to edit them in a better way – this especially applies when I’m doing client work.
There are some great plugins that add a button to the editor toolbar, which allow you to create a shortcode via a popup (you don’t have to type out the shortcode manually). But what none of them seem to do is allow you a way to use that configuration popup for already existing shortcodes within the page – for me this would be the perfect way to edit a shortcode.
After previous failed experiments I gave up on trying to improve this, it all boiled down to the flexibility of the in built TinyMCE editor – which was beginning to get stuck in the past and not providing a reliable enough experience across browsers.
That is, until the recent announcement that WordPress 3.9 will be using the new TinyMCE editor version 4.0.20. With some consistency improvements across browsers and better copy and paste functionality in the new version of TinyMCE we have the power to do more, visually, with the editor while providing a reliable user experience across modern browsers.
So, I’ve created this plugin as an experiment, to test what the new TinyMCE can do with WordPress and to begin to tackle the two problems I first mentioned.
Drum roll please…
What are Forget About Shortcode Buttons?
Forget About Shortcode (FASC) Buttons plugin for WordPress is a visual way to add buttons in the post editor screen. Instead of adding shortcodes in the post editor, you insert real, styled buttons – making the process of adding buttons to your posts and pages much more natural whilst improving the appearance and usability of the post editor.
FASC Buttons tries to be as clean as possible with the html, only using data attributes for necessary features – the buttons you use in the post editor use the exact same classes as on the front end of your site with no extra or hidden markup to make them behave this way.
Editing a button couldn’t be easier – just double click a button and an options panel appears allowing you to completely reconfigure the current button – beats tedious shortcodes and using precise syntax!
FASC Buttons will only work with WordPress 3.9 and up.
Download
Download Forget About Shortcode Buttons Plugin from the WordPress Plugin Repository:
How to use
Once you’ve downloaded the plugin and installed it in to your WordPress site, you will find a new button on the toolbar in your post edit screen. This will display a popup allowing you to create a new button in your post/page. Create your button, click submit and that’s it! You’ll be able to see your new button in the post editor as you would on the front end of your site – and if you’re not happy with it, just double click one of the buttons you have created to edit it 🙂
Documentation
It should be pretty straight forward to use these buttons with virtually no learning curve. However I’m sure there are some things that need covering in some form of documentation – check out the project page for now for some info about compatibility:
Vz974
Hi many thanks for this plugin. Worked like a charm until I moved from WP 4.1.5 to 4.2.2 .
Previously created buttons still work on front end but unable to create new one because it disappeared from WP post editor. Any help with that ?
Ross
Please check this fix – https://wordpress.org/support/topic/buttons-on-custom-post-types?replies=7 – I will be adding this to the plugin in the next version
Vz974
Sorry about my previous comment – it works now . Probably a refresh bug
Guillermo G. Granda
Hi Ross,
I’m trying to use your fabulous Forget About Shortcode Buttons plugin to add buttons on my site’s product pages, but the option doesn’t show up in the text editor, is there any way to make it possible?
Thanks in advance!
Ross
Hi there – I’m not sure, there was a problem with the button showing up on custom post types – a user has a fix for this which I will add to the plugin – https://wordpress.org/support/topic/buttons-on-custom-post-types?replies=6
Omid
hi
sorry for my poor english
there is a bug in your plugin
when i choose insert button at post editor at button color i dont have colores part to choose my color manually.
this is a photo of bug http://oi62.tinypic.com/2dkzddg.jpg
Roger
Hi, I installed this plugin but no button appears in my post edit screen or my page edit screen. I have activated the plugin, I’m using classifiedengine theme. Am I doing something wrong?
Ross
Hi there
Is your post a custom post type? A few users have reported that this does not appear on custom post type screens, only regular post & page post types.
Thanks
Anubistar
Hello there,
I’ve installed the plugin on WP 4.2.2. using Generate Pro Theme (Genesis Framework) and the no button appears to me as well – …using no custom post type, regular WP posts.
thank you, cheers,
r
Ross
Please check this fix which applies to custom post types – https://wordpress.org/support/topic/buttons-on-custom-post-types?replies=6 – development is on hold for the next few weeks after this I will begin bug fixing again 🙂
Maxi Collins
Whoooooooooooooooooooooooooooo…huuuuh!
Oh my God!
This is stunning…and unbelievable!
Let us all forget about short codes.
Elizabeth
First of all, I LOVE your plugin. As someone without any programming experience, this has been a fantastic and easy to use gem. My problem is that, while the buttons work great on my desktop, when I use them from my iphone they come up with a “page not found”. Any ideas?
Ross
Hey Elizabeth – this plugin should never interfere with anything like that – I would recommend disabling the plugin, and I expect you will get exactly the same problems.
Thanks
Elizabeth
But if I disable the plugin then the buttons that I created with the plugin will disappear. Are you telling me that I just shouldn’t use the plugin at all?
Ross
Hey, as a test – disable this plugin to see if you still get 404s – create normal links in WP with the exact same URL (copy & paste to make sure) – if you still get 404s I would suggest to look at the URL attribute – make sure this is the full URL (with `http://` etc)..
If this still doesn’t work – I would say that another plugin or custom JS is interfering with the buttons. This plugin does no fancy trickery on the front end – it just uses a standard anchor tags for buttons, and styles them up nice – so for different versions of your site (mobile vs desktop) then I would suggest the problem lies in another plugin you are using. As a final test, you can add these buttons to a regular WP theme and I’m sure you will find no errors like this.
Thanks
Elizabeth
I figured it out. Thank you so much for your help!
🙂
Stuart
Just what I was looking fir – until I installed it and found I couldn’t set a border or border properties.
Still a really nice plugin but borders seems basic to buttons – for me anyway
thanks
Ross
You’re right – borders are coming sooooon!
Andy Harris
Hi there, Playing with the plugin which looks great. One question: how can I change the font for the text in the button?
Ross
You can change it just the same as in the editor – drag and highlight the text around the button, and change the font 🙂
Martin
This is excellent and I now have it installed in all my new sites. Thank you very much for your work. If you accept feature requests, can I ask that you add the ability to store a default button, or perhaps some favourites? Being able to store the color/design as a favourite template and just adjust the link for each use would be great. The reality is I settle on one or maybe two designs per website, so it would save time if I didn’t have to configure the button every time I needed to add one to a new post. Many thanks again.
Ross
Hey Martin
Updates resuming on this plugin soon, and saving buttons is top priority 😉
Thanks
Michael Thorn
Fabulous plugin – just what I was looking for while working on a revamp for an author’s website
Ross
Thank you! The plugin has been somewhat on hold for a while, but hopefully soon I will get to do some much needed updates 🙂
Stuart
Hello,
Have you seen this before- since I loaded your plugin I have been getting 500 internal server errors. The error log points to a WP plugin- and cpp661 error which has to do with processes I believe.
Any thoughts. I have disabled it and will see if it happens again.
THX
Ross
Hey Stuart – I’ve not seen this before – its quite odd because this plugin is really such a simple one, small file sizes and not much php code actually – most of the code is written in JS and there should be nothing funny with server errors…
Could you please test the plugin on a clean install?
Stuart
Ross,
I have reinstalled your plugin and will be using it exclusively for buttons- my hosting company told me it was the most recent wordpress plugin installed so I assumed it was this. After calling them back when the problem continued after deleting your plugin they finally told me it was that the email processes were not closing out for 2 accounts and pushing me past my limit of 25.
SO I WILL HAPPILY USE YOUR GREAT PLUGIN ONCE AGAIN- AS THERE IS NOTHING FROM THIS PLUGIN CAUSING ME ANY ISSUES!!!!!!!
Keep up the great work- it is the easiest button plugin or generator I have ever used, and makes professional looking buttons.
Ross
Haha thats great news and thanks Stuart 🙂
Honeygirlk
THANK YOU! for this plugin, it has made things really easy for me. I would love to be able to see this updated so we can actually upload our own images into the plugin to turn those into buttons so it will match my layout – but regardless… I’m super happy with this – thanks so much!
Ross
No worries 🙂 Do you mean to upload images as icons? I’m not sure I will add this, but I may add some more font icons – the great thing about the ones we use are the fact that they can scale up or down to any size and be perfect quality – so they will look crisp in all sizes no matter what device or the size!
Günter
Hi,
I’ve found your plugin today and after a bit testing I have to say – very good.
If it is possible it would be very great to implement the attribut: rel=””
Would be good for example for a pic or a video in a lightbox.
Thank you
G
Ross
Hey Gunter, thanks, this is coming in the next update – you will be able to add any html attribute that you like to the button via an advanced tab – should be up by the end of next week 😀
John Berger
Hi Ross, I installed and activated FASB but it didn’t show up in my visual editor. I re-installed but still no-go. Any ideas?
If and when I get it running, can I put buttons into my sidebar widgets? I want to add a Register button.
Cheers,
John
P.S. I’m the one who commented about no sound on the video – silly me, it’s actually quite clear. May be you don’t need sound…
Ross
Hey John no worries haha – it does seem a little strange when there is no audio – your not the first to mention it!
Not sure why you can’t see the button.. What version on WP are you running? Do you have a link I could look at?
RE sidebar widgets – there are few updates I’m making to the editor popup first over the next week or so and then I will start to look at integrating the plugin further within WP such as in the sidebars 🙂
Enstine Muki
Hi Ross,
The theme doesn’t have a problem
I upgraded your plugin to the current version 1.0.3 and that’s what’s the issue. Right now it’s disabled and everything runs perfectly well. Each time I enable it, my blog becomes sort of shattered. Looks like the css file doesn’t load. Any idea?
Ross
Have you tried clearing your cache fully and checking again? I realised I didn’t use WP built in cache busting methods and have had another user already report errors because of caching, clearing the cache seemed to fix it for them.,
With the next update there should be no caching problems.
Do you have a link I could look at? Its really hard to guess what is going on in your setup – by shattered, what does this mean? What does the developer tools give you, do you see any 404’s in your logs with this plugin enabled?
Enstine Muki
Hey Ross,
No 404 errors. Just imagine my blog without the css loaded.
I have captured the screen. How do I send to you so you can have a look?
Ross
You can share on here? – http://snag.gy/
Or if you need it to be private I’ll drop you an email
Enstine Muki
Hey Ross,
I like dropping the mail using the contact form. I’ll reply to it with image attached
Ross
Cool, I just pushed an update to the plugin (v 1.0.4) – let me know if the new update helps!
Enstine Muki
Same issue
Maybe it has to do with my wp performance plugin. Will have to look into it later on today
Ross
It is possible… it seems strange that an update to this plugin would cause your site to break, when the only thing it did was add in FontAwesome icons, and slightly changed the layout of the popup in the admin area – all existing buttons etc should continue to work fine – let me know how you get on anyway.
Enstine Muki
Hey Ross,
How are you doing?
Your plugin now works so great
I have written a post about it on my blog
Please check it @ http://enstinemuki.com/create-css-buttons-wordpress-no-shortcodes
Let me know what you think
Ross
Hey thats great thank you 🙂
Enstine Muki
Very beautiful plugin dude but I just upgrading to the latest version with wp 3.9, Genesis Prose and my blog became a mess. Any solution?
Ross
Hey Enstine…
If upgrading WP broke you theme, then you need to contact your theme developer and find out when they will be supporting WP 3.9… There is not much more I can do really.
As a matter of process… I would always check that my theme is compatible with a new version of WP before upgrading as some developers take longer to do this and once you upgrade it is very hard to go back! 🙁
Surfdawgz
Thanks for taking the time to mull this over. I’m wondering if “TinyMCE” would affect this? Thanks again for your awesomeness!
Surfdawgz
I loved the concept of your plugin so I installed it. However, anytime I try to do something with it such as click on the insert button it gives me a box telling me I got a 404 error. I’m compatible on everything so I can’t figure out why it doesn’t work.
Ross
Hey Surfdawgz sorry to hear that :/ So what you are saying is the popup won’t load and shows a 404?
I once had a really annoying problem with a shortcode plugin actually which used a popup in the editor and gave me this headache for days.
Try this:
The popup is actually a html page, so see if you can access it by loading the URL directly (replace yoursite.com with the URL of your install):
http://www.yoursite.com/wp-content/plugins/forget-about-shortcode-buttons/assets/js/fasc-buttons/popup.php?source=insert
If you are getting a 404 on that URL, navigate via FTP to your plugins folder to see if a file called `popup.php` exists at this path…
If it exists and you are getting a 404 then you are getting the same problem I once got, it was a really strange problem to do with permissions on the server of the `wp-content`, `plugin` and `plugin-name` folders…
Let me know if that helps?
Surfdawgz
Tried all of what you suggested and ended up with the same pop up of my site with the 404 error. Not savvy enough to use the FTP.
Ross
Do you have a link for your site? I could have a quick look.
If the plugin cannot find the popup page, that means either that:
1) It doesn’t exist, so there was a problem installing the plugin, try redownloading/installing to see if that helps
or
2) Your server settings prevent access to resources in the plugin folder so that the plugin does not have access to its own popup page – in this case it is as is described above, you may need to edit permissions on your server but it sounds like that is something your are not comfortable doing 🙁
If you can try reinstalling the plugin, and then send me a link I’ll take a look and see what I can do 🙂
PS please keep replies on here rather than via email (unless you send sensitive info).
Thanks!
Surfdawgz
Hi Ross, sorry about the email thing. I have a lot of plugins on my site and have had little problem with them so I can’t see why anything would be restricting access to it. I just deleted and reinstalled the FASC for the third time, still getting the pop-up of my site with the 404 error. My site is http://www.camptonheights.org and if you need my password to get in I would be more than glad to give it to you via your email. Thanks again!
Ross
I just figured out it was your website camptonheights.org and have found you do in fact have the problem I described – its not a nice one to have 🙁
If you go to this link:
http://www.camptonheights.org/wp-content/plugins/forget-about-shortcode-buttons/assets/js/fasc-buttons/popup.css
It loads fine which means the plugin exists. The problem you have, which I also had, is that php files wont display – this is something to do with your server set up and permissions – which was a real pain for me to fix on a clients site a long time ago..
Try this link:
http://www.camptonheights.org/wp-content/plugins/forget-about-shortcode-buttons/assets/js/fasc-buttons/popup.php
This should load a popup page instead of a 404 – which is why you are getting the problem.
You mention that you are using other plugins, but do you have other plugins with popups in post editor screen? This is where this specific problem kicks in…
I have to say at this stage there is not much more I can do until you are comfortable checking some things via FTP and trying to change your permissions.
However, this plugin does not really need to use PHP in the popup (I think it will work fine with just .html).
Let me have a think, I am doing some updates at the moment so I will try this and maybe I can have an update for you which avoids using PHP files 🙂 The problem really though does lie with your setup – which is what I faced before and there were several plugins which added popups to the editor I could not use as a result.
Surferles
Fantastic! Truly amazing. You read a lot of comments that make this claim. But this is hands down one of the best utilities on any platform anywhere!
Did you work for Apple, cos it’s freakishly simple and powerful
Ross
Haha thanks Surferles glad you like and good to see you’re already using them 🙂
Adam W. Warner
Hi Ross,
I just found your plugin on the repo and have put it to the test. Great job and thanks for releasing this!
It solves a couple pain points that many WordPress admins have struggled with for some time:
1. Visualizing the output of shortcode buttons
2. Being a Non-designer and trying to make good looking buttons!
I’ve written up a post about it on our site and have linked to it above. Hopefully it will help you get some more downloads and awareness:)
Ross
Hey Adam that’s great thanks for sharing – I think there are many more who share your (our) pain when it comes to shortcodes… For me when I make client websites this is a big problem, its a hurdle when I have to try to teach non technically minded users how to use shortcodes… I hope this plugin fills that gap when it comes to buttons at least.
This plugin started more as a proof of concept, and there is plenty more I need to do on it (for example there are no rollover states just yet!) so will try to make a couple of updates before the general release of WP 3.9 next week.
I actually have a few more ideas leveraging this same technology/concept so hopefully we can get rid of a few more UI elements that we’re currently having to use shortcodes for.
Glad you liked the plugin anyway and thanks for the support 🙂
It would also be really helpful if you could leave us a rating over on the WP plugins site to get the ball rolling and gain the plugin more visibility… 🙂
Adam W. Warner
But of course, favorited and reviewed:)
Looking forward to continued updates and enhancements….
Ross
Thanks Adam 🙂