Since we work primarily with Craft CMS here at Extreme, I thought that for my Hacktoberfest day it would be good to give back to the Craft community.
I’ve worked a lot on Craft 2 sites and thought I would challenge myself with some learning at the same time — this meant creating a brand new Craft 3 site and looking at one of its plugins.
There are many differences between Craft 2 and Craft 3 that I have found throughout the day, but I’m not here to talk about them.
So, to the work.
I chose to look over the issues in the Retour repository by nystudio107. Here at Extreme we have used this widely across sites on both Craft 2 and Craft 3 and it is one of the plugins that we use on all our new builds.
Retour, for those that aren’t aware of it, is a plugin that means that users in the CMS can simply add redirects to the site. There are some improvements in the latest version of the plugin, but there are features that people are looking to add to it.
The Craft 2 version was a form that was simple enough to understand so, once installed, site owners could do their own redirects without needing to add it to an NGINX config file or a .htaccess file. This would need to be done by someone with server knowledge which could become expensive with lots of redirects.
The latest version has so many nice new features with a dashboard to show 404s which you can export and redirect.
Retour for Craft 3 now also has the option to export your redirects to check that they are correct and you can update them easily enough. There is now the option to upload a CSV so there is no need to manually add thousands of redirects if you are doing a site migration.
Back on topic, there is no way to delete multiple entries at once. There is a way to delete them, but only one by one. This would be time consuming if someone put them into the CMS incorrectly.
So, the stage was set to create the functionality to do this. Firstly, this isn’t a simple plugin so getting to grips with the codebase was a challenge in itself. It’s got PHP, VueJS and Twig to play with. Firstly, output the checkboxes so that multiple links can be checked and deleted. Secondly, create the button to click to start the process and lastly, replicate the ‘delete’ function for multiple links.
Creating the checkboxes, I added these into the Vue file and output them. I created the button in the body initially, but thought that it would look better with the rest of the buttons at the top of the page. So, replicate the functionality in the redirect controller to enable the delete action of more than one link. The final CMS outcome looks like...
Initially, like I said, the key stepping stones I had to cross were getting to grips with the code and re-building the plugin when I had made some changes to the code base, but once these were done, I got down to the development of this.
All in all a very good, fun-filled Hacktoberfest day…
The Extreme x Hacktoberfest series so far...
Could our dev team work some magic on your digital presence?
Show me the codePost by
Project
