Adventures in technology at the library.

Monday, May 25, 2015

#JoomlaProblems

This is going to be a lengthy post because after a traumatic experience such as this, I find it helps to talk out all of my feelings on the subject.

For this assignment, we were tasked with the creation of a website using the open-source CMS Joomla.  I decided to build an author page for my Mom, a published romance author whose own webpage wasn't looking that great.  (She made her site using a paid version of WordPress, by the way.)  Let me break down the experience below.

We were using the demo version of Joomla that did not require the full download, which I believe may have contributed to some of the initial confusion when the demo videos did not reflect the menu screens I was seeing.  However, I was able to follow along and create some of the basic pages such as the home page, products page (in my case "Books"), and contact page.  The basic process of adding any page to Joomla is their 1.) Create 2.) Add 3.) Show method, which creates lots of opportunity for fun errors.  First, you have to create a Category, such as "home page stuff" or "books page stuff".  Of course, you'll want to name this as closely as possible to your Menu and Article titles so you can confuse yourself later on /sarcasm.  After you create your category, you write "Articles" that contain all of the content you need.  I downloaded the JCE Editor WYSIWYG extension to help out by making my article creation page look like a familiar blog word processor.

JCE Editor WYSIWYG extension in action
The demo also showed us how to style our text into headings that we wouldn't be able to customize in our free demo version, but wouldn't be able to realize that until much later in the process and lots of hair pulling.  However, the basic process of typing text, adding pictures, inserting hyperlinks, etc. was fairly standard for blog software that for some reason did not come standard with Joomla.  My only confusion at this point was I wanted to add a Facebook link, but that required an extension that was not working with my demo version, so I settled for the cheap solution of finding an image of a Facebook button, highlighting the button picture, and making it a hyperlink to her Facebook page.

After you have created the Article and named it - you have to then assign it to a category you've already created - in my case I had created one for About that contained this homepage and the page for the About Evelyn section.  After you put the article in a category, you have to create a Menu to assign it to.  This is the Create (category), Add (article), Show (Menu) process.  It seems pretty redundant to assign an article to both a category AND a menu, but it made sense later for the Books page, where instead of assigning individual articles to a page I basically told it to display all the articles assigned to a particular category.  This method is called the Blog Category template for Menus, and it's probably the feature that was the nicest about this process.

The "Category Blog" makes a great Products/Books page
Thankfully one of the video tutorials specifically explained how to create this Category Blog page, which allows you to show small images and a brief description of an article that then links to a fuller article.  It's perfect for displaying a list of things, such as products or books.  As with my Facebook link frustration, the Amazon Cart required a type of extension I didn't have, so I had to settle for writing out the word Amazon and turning it into a link to her book on Amazon.com.  All in all this page took a TON of work, but it's the page I like the most.  Clicking on the title of her book brings you to a bigger picture of the cover, a longer description of the book, and an excerpt.

You can use this same Menu template to create an Events page, however you have to sort the stupid things manually because Joomla does not have a built-in calendar extension that can intelligently read dates and sort by them.  Instead I used it again to create the Just for Fun photo gallery page for the website.  I could have done the same process I did for the books where each image was just a small thumbnail that linked to a larger version on another page, but because of the sheer amount of images I wanted to upload (12) that process was much too involved.  The result was an image gallery with static images that do not let you click on them.  Sorry.  There were several photo gallery extensions I tried to download that did not work - I'm assuming because I did not have the full version of Joomla.  I really think that Joomla ought to come standard with an image gallery, as many other free CMS programs do (such as WordPress, for example)

"Category Blog" menu template used to make a Poor Man's Photo Gallery
The final page I made was the Contact page, which I used the video tutorial to make.  Unlike the other pages, Contact pages do not use articles, but rather a special component that makes them confusing as sin.  My main problem was that as an author page and not a business page, I didn't want to include a mailing address, so I just put the email address in the Contact form and tried to hide the headings that went above the missing Contact information.  This is actually impossible to do (at least on the demo version) unless you find the CSS code section and do a "Language Override" to tell it not to show the other headings.  I only found out how to do this by Googling the problem and finding this set of instructions.  It worked.  I don't know how, but it worked.  So let's leave it at that.  I also followed the video's suggestions and installed the reCaptcha plug-in that prevents robots from spamming the contact form.  I installed it, but was unable to test it because the Contact Form does not actually work.  I don't know if I did something wrong or if this is another symptom of having the demo version.  I give up.

Contact Form with reCaptcha Plug-In
(
Spoiler alert - it doesn't work)
The final thing I wanted to do was customize the look of the website.  This is probably one of the worst features of Joomla.  Unlike basically every other free CMS that I've used (Google Sites, Blogger, WordPress, etc) you cannot just drag features of the webpage around to where you want them.  If you want to create a column on the right or switch the position of the menu bar with the header, you're going to have to go to this weird version of your website by typing "?tp=1" after the URL to get a confusing screen that looks like this:

Magic secret page that reveals module positions - SO USER FRIENDLY, RIGHT?
After you determine the position numbers, you can then go back in and edit what position certain modules like the image bar, menus, or columns go in.  I was able to find the image bar they were using and replace it with a border I had created.  I duplicated the image bar and put it at the bottom of the website as well.  Then I tried to do something I thought was going to be relatively straightforward - add a header image instead of the site title.  So I created a very basic image header in PowerPoint that was the size I figured was the correct width for the website (1020 pixels, or about 14.72 inches).  Except whenever I tried to upload the header image into this stupidly basic and unhelpful menu, it kept resizing it to 720 pixels wide.

Really? This is the ADVANCED menu?

After yanking out most of my hair, I thought:  screw it - I'll just create another image bar module like I did for the border.  It also only uploads 720 pixels wide, but it did let me stretch the border to the right width before.  So I did this, which made my header distorted a bit because it had degraded the image quality (yay...), but at least it fit across the width of the screen.  However, then it wouldn't let me delete the site title from the top.  After lots of Googling and frustration, I found out that the reason I couldn't edit some of these more advanced functions was because I was using the demo version.  I really, really hope that on the full version you would be able to edit some of these features or maybe even *GASP* add a background image instead of a plain color.  I'm not even going to get started on the fact that to choose a font for my headings I had to look them up myself in Google fonts without even a preview screen in Joomla.  Wow.  (I mean, they know that every other blog site has a font menu, right?)

A header that is not a header - plus the site title that won't go away
So that's it.  I wanted to add in the WordBridge extension that would allow me to integrate her WordPress blog as a RSS feed in one of the menus, but - again - I could not install it because I was using the demo version.  Ha.  Hahaha.  I give up.

The final torture feature that I wanted to try out was the Akeeba Backup extension that Joomla recommended I download, but somehow didn't come standard with...  Because the video walked me through how to install and enable this feature, I did not have any major problems with backing up my site.   The only weird thing was it told me to download my backup in case something went wrong, but my computer doesn't have program that could read the backup, so I just kind of shoved it into a folder I hoped I wouldn't need later.


Akeeba Backup extension in action
So that's it.  This is my finished product.  So would I recommend Joomla to a friend?  Only if I had a sadistic sense of humor.  The entire point of a CMS - unless I'm mistaken - is to be a cheap way to make website development easier for people who don't know how to use HTML.  This CMS failed miserably.  Its three-prong 1.) Create 2.) Add 3.) Show method is overly complicated for novices and leaves lots of room for user error.  However, most insulting is this software isn't any easier for advanced web designers either because it makes finding and editing the CSS code SO difficult!  The one time I tried I realized you couldn't even use your browser's CTRL + F find feature to find the line of code you wanted, because they put it inside of a little box THAT WASN'T SEARCHABLE.  HA...ha...no.  This combined with the fact that even the most basic extensions that a website would want (WYSIWYG editor, photo gallery, calendar, blog) do not come standard with the software.  All of these features require a plug-in or an extension from a third-party, which opens you up to the risks of downloading something that works terribly or does not play nicely with the other plug-ins or extensions you downloaded.

My advice?  If you really don't know what you're doing, use WordPress or pay for a SquareSpace instead.  It may not be as powerful ultimately, but at least you can throw up a half-way decent and functional site without bursting any blood vessels.

No comments:

Post a Comment