The theme will ensure the images you use will look good on all retina devices. Simply follow the instructions below.
1. You will need two to make two copies of your image: one image at the normal size you desire, and a second copy that is twice the size of the image. Please ensure that the name of your images are all lowercase and does not contain any spaces, characters, or symbols. Failure to do so may prevent the image from displaying upon publishing your site.
2. Both images must have the same name, however, the image that is twice the size must end in @2x. Below is an example of the two images needed for proper retina display if the name of the image being used was boat.
Image 1(normal size): boat.jpg
Image 2(twice the size): firstname.lastname@example.org
3. Place both images in the resources area of RapidWeaver and place the smaller/original sized image in the area of the theme you desire.
4. Under the Toggle Style Option, select Enable Retina Images. The theme will take care of the rest and ensure retina devices use the images provided to display a high quality, clear picture.
*Please note that for most banner images, background images, and any other large images, it is not only unnecessary to utilize this built-in feature, but it may significantly slow down the load time of pages due to the size of large image files. This feature should be used for smaller images that may not appear as clear on retina devices. This feature will not work for standard image stacks as stacks automatically generates a new name for images placed in an image container.