April needed a portfolio website where potential clients could see her work. She had purchased a premium theme but needed a developer to extend it and help her style her website the way she wanted it. Below I explain some of the challenges the theme presented and how I overcame them with code.
Portfolio Grid
The thumbnails in the portfolio grid display the project title and description with a hover effect. The first obvious downside of this is that mobile users cannot see this information, since there is no hover effect on mobile. My solution to this problem was to use Javascript Intersection Observers to display the titles as the user scrolls down the page. The script adds and removes a CSS class as needed to create the desired effect and CSS Media Queries ensure that this only happens on mobile devices.
April also wanted to be able to format the text in the hover effect by adding line returns. This was tricky because the theme uses the WordPress post title as the text to be displayed, and WordPress doesn’t support line returns in the title out of the box. Luckily, I was able to use a PHP function to add the desired functionality.
404 Gifs
April also had a cute idea to use a bunch of 404 Gifs she made for a custom 404 page, which so often is a page of the website that doesn’t get the attention it should. Her idea was to have a gif displayed randomly and give the visitor a way to see different gifs. WordPress makes this fairly easy to do by simply creating a 404 page template and using some basic PHP code to randomly generate the gif. Now she has a 404 page that she actually wants visitors to see. How many people can say that about their website?
Conclusion
Premium themes can be useful, allowing you to create an attractive website quickly but they often will not do EVERYTHING that you want them to do. Sometimes, in order to make your website perfectly how you want it to be, you need a developer to dive into the code and add the features you want. But it is important to customize the theme in a way where it can still be updated by the original developer. I’m glad that I was able to use my coding skills to make Aprils portfolio a website that she is happy with.
Visit Site