Over the past few weeks I have been rather laboriously warehousing the images on this site. I use the RapidWeaver web building application that allows you to add images and format them. However, the result is that the RapidWeaver project file grows and grows. Warehousing resolves this issue by storing the images on the web server and using embedded links to call each image as required. There are an enormous number of third party add-ons for RapidWeaver and many include the option to warehouse any images. For example, my photography pages are built with the Nick Cates Photo Stack and use warehousing. However, the basic blog page in RapidWeaver cannot be significantly enhanced with third party add-ons, which leaves you with the need to format the image position on the page, requiring some code.
My challenge, therefore, was to modify the three sections of this site that use the basic RapidWeaver blog page, namely my film reviews, the golf diary and the long-standing fishing diary that dates back to 2003. The film reviews weren't too bad to modify, as most have only one image, which is centred. Similarly with the golf diary. I only needed one piece of code to sort out most of the formatting in these cases. But the fishing diary was a different matter. Many entries have multiple images and even before I started, the layouts of the individual reports weren't that attractive, with images stacked one above another down the page. This was the time to improve things.
In the end, after browsing forums for tips, I put together code for placing images to the right of the page with wrapped text, which was a suitable solution for the majority of the entries. More of a challenge was placing images side by side with suitable spacing, but after a bit more research I achieved this as well. And I learnt some new things along the way, including the use of the new HTML5 <FIGURE> and <FIGCAPTION> tags. Modifying all the diary entries was a slow process but it's now all done and I think they look much better than before.
The fact that all images are warehoused shouldn't affect the viewing of the site, although in some cases there may be a slight delay as the image loads, during which the ALT TEXT should show. And my project file is now 16MB, down from 115MB.
This site is built in Rapidweaver, an application that takes all the hard work out of web site creation. It comes with predesigned themes and there is also a burgeoning third party developer market that offers not only themes but add-ons for a wide range of specialised functions. I referred briefly to this in my previous blog post in which I described my efforts in adding a 'read more' function to some text-heavy pages. One feature of Rapidweaver is the ability easily to change the theme, while in theory everything else stays the same. But in my case I wanted to tidy up the file structure of the site so that I could implement cruftless links, and doing this led to a range of problems.
My previous theme was Navigator by Elixir Graphics. I have been using Elixir's themes for a long while and find the customer support superb. However, Navigator was a little unusual in that if you wanted a sub-menu structure, by design the parent page didn't display. This meant that in the breadcrumb trail, for example, the parent page was greyed-out, requiring you to go back to the main side menu to reach another of sub-menu options. The screen shot below explains it better than words:
A little while ago I bought the BANX theme from Henk Vrieselaar (Tsooj Media) to build a site for my daughter, and I found it to be very flexible with the author providing a range of code customisations for additional features or tweaks to appearance. Henk has since dropped out of the Rapidweaver market and his catalogue is now managed by Will Woodgate at Stacks4Stacks. I decided to use the BANX theme for this site.
I use Rapidweaver for my own personal website and a few others that I manage. On my personal site some of the pages were text heavy and I thought that a 'Read more' feature would make them less off-putting. The trend seems to be to have minimalist content because web surfers are notorious for rejecting anything that looks like it will need time to digest. I think they're called the 'Now Generation'.
There are many third party developers that produce add-ons for Rapidweaver that allow a host of additional features without the need to code or have any detailed technical knowledge. So I thought it would be easy to find what I wanted. However, I was perhaps guilty of not doing my research deeply enough, as I had two false starts before getting what I wanted.
My first port of call was DooBox where I found Trunk8 (truncate - get it?), a 'stack' (an add-on) that limited the number of lines shown on screen with a 'Read more' link to see more. This seemed to fit the bill, but I should have been a bit more circumspect as the demo of the add-on showed how it can keep multiple columns the same length by fixing the number of lines displayed.
I bought the stack and tried it out, only to find that if I had any layout in the text, such as paragraph returns, these were completely ignored. So when applied to a page of text the resulting display showed it all concatenated. This wasn't what I wanted. A posting on DooBox's Slack forum elicited no response from the company, so I guess it does what it does and so tough! The £8.99 I paid is probably not wasted as I may one day want to do what the stack is designed for, but not today.
Sometimes what you think is going to be the easiest of tasks proves to be much more complicated than you could have imagined. On my site I have film reviews and have created a separate page that lists all the reviews alphabetically. I thought it would be useful to include a search facility to assist visitors to find a specific film, something that will become more and more useful and the listing increases in size. We are told that computers are great at performing text searches so I expected to find a solution without too much of a problem. I was wrong.
The site is built with RapidWeaver, so the obvious first port of call was to look at add-on stacks for the Stacks page system. I soon found cleanSearch by 1LD (one little designer), advertised as 'Search bar for finding terms on a single page', which on the face of it seemed just what I wanted. Unfortunately I didn't take enough care reading the tutorial, and having bought the stack found that what it in fact does is search within each stack on the page, bringing any stack containing the search term to the top. This was no use to me as it would require each of what are already over 150 listings each to be placed in a separate stack. The effort of doing this and maintaining it as additional films were listed were not justified.
As I've explained previously, my blog is now on my personal website. By using the Armadillo stack in RapidWeaver not only can I post to the blog from any browser, but a facility exists to add a facebook share button to each blog post. However, I am running three other blog pages on this site, for cinema reviews, my golf diary and my fishing diary. Transferring these into Armadillo was not feasible without some sort of automated option, which isn't available. So these three 'blogs' remain as native RapidWeaver blog pages.
I thought it would be nice to add a facebook share button to each post in these blogs and set about trying to do this. My efforts weren't rewarded. The facebook developer pages allow you to generate code for the placement of a share button, involving three code snippets: one to be placed in the page's Head section, one in the Body section, and the third where you want the share button to appear. Having negotiated the difference between meta name tags and open graph meta tags, the latter being required by the facebook code, it soon became clear that the native RapidWeaver blog page applies the same Head and Body code to all the posts, because in effect the posts are sub-sections of one large page. This being the case it seemed to be impossible to generate a unique share button for each post. Well, that is the conclusion that I eventually came to.
As part of the reorganisation of my web presence I have decided to add photo galleries to my personal website. I currently have a small portfolio of images at 500px, a site that offers images for purchase. I've no illusions about anybody wanting to buy any of my images so I've decided that I will unsubscribe from that site before my next renewal in July 2017. Thus the reason for establishing photo galleries here at Kilburnlad.
I had bought the Photo Stack from Nick Cates Design and had already implemented some galleries within my Fishing section, and on the Chatteris page. However, for my new photo galleries I've taken a warehousing approach for the images. This was new territory for me and while it's not terribly difficult, I had a couple of false starts. Basically, warehousing involves uploading the images to your host server and then calling the images as needed by the Photo stack. The main advantage of this is that the images are not embedded within the RapidWeaver project file, which means that they don't need to be rendered each time you re-publish your site, speeding up publishing and keeping your project file smaller.
I've managed to restore the light box galleries on the Chatteris, Best Fish and (Fishing) Places pages. I use the Nick Cates Photo stack and for some reason the images had vanished from the site. After a bit of experimentation I found that I needed to remove and then re-insert the Photo Base stack on each of the affected pages. Fortunately I didn't need to remove the individual Photo Group stacks, but I did need to re-drop all the images, which was a bit laborious. Everything should now be working.
I've just noticed that the photo galleries are working on the site. There have been two updates to RapidWeaver recently so I suspect that the Photo stack has been adversely affected. I shall need a while to sort this out so in the meantime apologies for the glitch.