The Online Shop Designer Blog

It is quite easy to upload and insert images into a Wordpress page or Blog post, but if you have not done it before it can be a little confusing because the system is rather different to other content management systems.

Image preparation

While it is possible (and easy) to re-size images from within Wordpress, it is always best to size then appropriately prior to uploading them. There are two parts to this process:

• Setting the resolution to 96dpi (depending on the image’s source it could be up to 300 dpi, which would result in a very large file that would be slow to download)
• Setting the physical dimensions (width x height) in pixels. There can be a bit of trial and error with this one depending on the available width of the content area of the page or post.  I suggest you start by setting the width to 250px. In most image resizing applications the height will adjust automatically to suit.
• If you don’t have an image re-sizing application have a look at Fotosizer. This is a great little application that lets you resize multiple images at a time.

Image Upload / Insertion

• Open the page or post you would like to add the image to.
• Click at the start of the paragraph you would like to associate the image with.
  • You will see that you can either align the image to the left, with the text flowing around it on the right, or vice versa.
• Just above the row of editor icons there is a lable “Upload/Insert” – click the square icon immediately to the right of this lable. Notice that if you hover your mouse over it, it says “Insert an image”
• The popup window defaults to the screen required to upload an image from your computer. This is the normal situation. Click the “Select Files” button, browse to the folder on your computer that has the required image, and upload it.
• A thumbnail of the image will be displayed, along with fields to complete as follows:
  • Enter a meaningful title
  • Set the Link URL to “None” unless you would like the image to be clickable, in which case you can enter the target address
  • Set alignment to “Left” or “Right” as required.
  • If you have sized the image appropriately prior to upload you can leave the size to the default “Full size”
  • Click “Insert into post”
• The image will now be displayed in your post. Often you may like to create some whitespace around the image so that the text does not appear to be crowding it. If that is the case do this:
  • Click on the image, then click the edit icon.
• In the pop up window click on the Advanced Settings Tab
  • Next to the “Image Properties” line set Vertical Space to 10 and Horizontal Space to 10. You can experiment with these values.
  • Note that you can also add a border if required. Try entering a width of 2.

That’s it!

If you have come this far you have done well. It seems like a lot of little steps when described in detail like this, but it will soon be second nature. Happy blogging

Was this post useful? Feel free to add a comment.

This is a two step process:

1. Create a zone called ‘Australia’
2. Create a tax code called ‘GST’ and assign it to the zone ‘Australia’

Creating a tax zone

• In admin select Shipping/Zones and then click ‘Add new’
• Assign the name ‘Australia’ and save
• Tip: while you are there remove any zones that are not applicable

Creating a tax code

• In admin select Payment / Taxes and then click ‘Add New’
• Enter the name ‘GST’ and ‘10′ for the rate
• Tip: as above, while you are there remove any taxes that are not applicable

You should now be set up to assign GST to products when you create them.

See also:

• Prestashop Quick Start Guide
  

Processing offline orders (i.e. those that are not processed automatically by a payment gateway in real time) received from Viart Shop is quite straight forward. Two methods that are common within Australia are Offline Credit Card processing (via a businesses EFTPos machine) and electronic Bank Transfer. The typical sequence of events is as follows:

• The customer places an order
• Confirmation is sent to the sit administrator
• If the customer selected offline Credit Card processing, the administrator will also receive an email with the last 4 digits only of the credit card number. The rest are encrypted and stored in the database for viewing in admin.
• The administrator logs into Viart admin and goes to Orders/Sales Orders
• The orders received are listed under the section “Orders Maintenance”. The most recent order will have the highest Order number, but the orders are also date stamped.
• Icons for HTML and pdf versions of the invoice are provided under the “Invoice” column. The pdf in particular provides an easy means of printing a properly formatted version of the invoice.
• On the far right hand side of the order line is a view/edit link. The following tasks can be performed after clicking this link:
  • Updating the status from “New Order” to reflect the appropriate status of the order e.g. “Goods Shipped”. It is important to keep the status up to date as the customer will be able to check this when they log in to their user account.
  • Adding a additional information: To the right of the pull down status field is a link that allows the administrator to attach a note for future reference about the order. There is also a link to add the serial number of the item to be shipped if these need to be recorded and a shipping tracking number (above the update button).
  • Payment method is below the Shopping Cart section and Personal details, which show the shipping address. If the customer has elected to pay by Babk Transfer the order status should be set to pending until payment has been received. If the order is to be paid by credit card then the first 12 numbers of the card only will be displayed. The remaining 4 digits are sent to the administrator by email. Note that those digits of the credit card that are stored in the database are fully encrypted.
  • The Order Change Log is at the bottom of the screen. This records all order changes and provides a very quick way of checking the particulars of any delays. e.g. how long it has taken to pack the order, or how long the administrator has been waiting to receive the Bank Transfer funds from the customer.
• Finally when the order processing has been completed and the goods shipped to the customer the status should be rolled over to “Goods Shipped”

Note: while processing orders in general with Viart Shop is not difficult, the most important thing, from both a customer and administrator perspective, is to ensure that the status always reflects the true situation.

Whether you have a modern CMS such as CMS Made Simple, or and online shop based on Prestashop or Viart, the facility exists for administrators to insert meta information to describe the page to search engines.  Here are some good references I have come across to help with this task:

• Making the most of meta description tags
• Writing meta tags
• Meta description tag

And this is a nice article on writing page titles just to round off the subject. While titles are arguably not as imortant as descriptions they are still relevant:

• SEO page title tips

And what about meta keywords?

Well, the truth is that they are no longer very relevant at all. Still, if you would like to use them ensure that you use no more than about 5-6 words. Long lists of keywords are more likely to have your site flagged for spamming.

‘Offline’ order processing refers to orders where the customer submits there credit card  details as part of the checkout process for secure, encrypted storage in the  database. The site administrator then (in the Australian context) retrieves the numbers and processes the transaction via an EFTPos terminal or online gateway. In this way processing offline orders in Prestashop is quite straight forward.

Here is the sequence after accessing your shop’s admin:

• Click the [Orders] tab
• Click on a line that displays the order of interest -the detail of the order is now displayed. The most recent orders will be listed at the top, and those requiring processing will be flagged “Awaiting Credit Card Validation” in the Status column.
• Click the [Click here to reveal the information] button under the Credit Card Information box to see the credit card details
• IMPORTANT: For additional security click the [Remove Credit Card Data] button after you have processed the order.
• Change the status (top left) during processing to reflect the stage that the order is at. The customer will see the status when they log on to their account.
• At the bottom of the screen there is a New Messages box. This can be used to add a comment to the order or send a message to the customer.

See also:

• Prestashop attributes (options)
• Prestashop quick start guide
• Prestashop image preparation and upload

Did you find this article useful? Feel free to leave a comment.