** page.php **
** content-page.php **

CMS Homepage Carousel [12]

WordPress
Carousel Instructions


For consistency, backward compatibility and servicing we try to use the same best solution for our websites, but obviously executed in a new and exciting way.

The Homepage page Carousel can be changed using the method below.

Photoshop (or similar software application) for resizing the image

More image resizing information can be found here.

1 Find your new image. Then open one of your existing carousel images in an art package like Photoshop (It doesn’t have to be the most recent version). Then copy and paste in the new image onto a new layer.
If the new image is too large, with the new layer active press CNTRL + t on your keyboard, this will give you a box and nodes around the image. You probably can’t see all of the new image either so press CNTRL + 0 to increase your window view.

2 This stage is to manually reduce the size of the image while keeping it in proportion. Make sure you are in the normal cursor mode. To resize hold down SHIFT while dragging the bottom right node (small outlined square on the box’s corner) diagonally up and left towards the visible smaller picture area in the middle. When you have shrunk the picture enough to fit, click outside (or return) and click Apply in the pop up warning box.

3 Now you can move the picture around with the arrow keys (or hold down CNTRL again and move with your cursor/mouse hold a click on the image and move) to get the correct composition. If it isn’t working, just paste the image in and reduce again applying it at a slightly larger size.

4 When an image has been re sampled on reduction (It doesn’t work the other way around, making images larger will degrade it considerably) they may benefit for a little sharpening. Try the Unsharp Mask (20% 1.5px radius and 0 threshold) can work well and you can adjust with a live preview.

5 Next, save for the web. In Photoshop the key combination SHIFT + CNTRL + ALT + S (or File/Save-for-web ) will bring up a new panel, makes sure it is a jpg of around 75 quality. Alternatively just select File/ Save-as and select jpg in the drop down list under the image. Name your image well so you can find it again, consider including “homepage” or “hp” with an “image number” in the name so that they can group together and don’t overwrite any others.

Now you have a new image it’s time to replace an existing carousel image with it.

Carousel updates using Media replace

Carousel updates using Media replace

Replacing the images using the website’s CMS
6 In the admin view of your site click on the Media (Library) in the left hand panel. Find the existing image to be replaced and open it. There will be a button to Replace Media and “Upload new file”. Locate the new file and then click upload. This will replace the current image with your new one and the original image will be permanently deleted from the library. Click save. Your carousel images should now be updated, visit you site to check.

7 If your Carousel also has text, this currently needs to be edited via the template. Also, if the new image doesn’t display this may be due to over zealous caching, let us know and we’ll sort it out for you.

This can be a tricky process. If you are one of our clients and need some more assistance, please get in touch and we’ll help.

Done.
Fivepilchard Team fp_logo_green

Updated Jan 2017


Contact us for more information