Rotating Images

This part of the User Guide will show you how to edit an existing rotating image (Text changes, image replacement) And how to change the order

Accessing the Rotating Images

STEP-BY-STEP
  • 1
    First, you'll need to log in on your website and access the admin Dashboard. Your link would usually be as follows :www.YourWebsiteName.com.au/Admin

    The login page should appear as below:

    Existing Rotating Images
  • 2
    Once logged in, navigate through the left menu panel.
  • 3
    Click onModules → Rotating
  • 4
    A list of all the groups for the rotating images will appear.
    Existing Rotating Images
  • 5
    Choose the group you wish to edit
  • 6
    Click on theImage Iconto edit
    Existing Rotating Images

Adding a new image

STEP-BY-STEP
  • 12
    Choose the group you wish to edit and click on the Image Icon to edit
    Rotating Images
  • 2
    Click the button "Create new image"
    Rotating Images
  • 3
    Upload a new image or select from media files.
  • 4
    Enter the URL of the page the banner will lead to once clicked
  • 5
    Select the URL target.
    • If you want to open in the same window, select _self.
    • If you want to open a new window, select _blank.
  • 6
    Click "Save".
    Rotating Images
  • 7
    The new image will appear as the last item.
    Rotating Images

Reordering the Images

STEP-BY-STEP
  • 1
    To Re-order the images, simply drag the image left and right into the order you wish for it appear.
    Existing Rotating Images

Editing The Image, Text, Link

STEP-BY-STEP
  • 1
    To Edit, Click on the Edit Icon on the photo you wish to alter.
    Existing Rotating Images
  • 2
    A pop up will then appear where you can edit theImage, Group it belongs to, Title, Text, and URL
    Existing Rotating Images
  • 3
    If you scroll further down you can also set a Start and End Date for this specific image to show.
  • 4
    Once done, hit Save.
    Existing Rotating Images
  • 5
    Refresh the page
  • 6
    The rotating banner images should show on the website and the changes should reflect.

Removing an Image from a Rotating Images Group

This can help in selling advertising space or promoting user products

STEP-BY-STEP
  • 1
    Log in as an administrator and go to the Admin Dashboard.
    Learn how to log in here →
  • 2
    From the left sidebar, go to Modules > Rotating Images
    Rotating Images
  • 3
    Once you select 'Rotating Images', it should go to the 'Rotating Image Group Management' page. On here you can select the rotating image group you are trying to update.
    Rotating Images
  • 4
    Click on the 'Show Group Images'icon beside the group
    Rotating Images
  • 5
    On the 'Rotating Image Group Management' page of the group you selected, you should see the images being used on that particular group
    Rotating Images
  • 6
    Hover over the image you want to remove
  • 7
    Click on the 'Delete image' icon to remove it
    Rotating Images
  • 8
    A pop up message will show to confirm if you want to continue removing the image
  • 9
    Click OK
    Rotating Images
  • 10
    A message pops up to let you know that the image has been removed successfully.
    Rotating Images
  • 11
    Reload/refresh the page where the rotating images are displayed.

Creating Banner Images on Pages

Why you would use a Banner Image

A Banner Image is commonly used on websites to capture attention, convey key messaging, and enhance the visual appeal of a page. It often appears at the top of a webpage or section, providing a strong visual hook. Using a banner image effectively can help establish a website's branding, communicate the page's theme, and engage visitors more effectively.

Banner images can support various content types, from promotional offers to seasonal messaging or product features. When chosen wisely, they set the tone for the rest of the content and improve user experience by drawing attention to the most important information. Additionally, responsive banner images adjust to different screen sizes, ensuring a seamless viewing experience on both desktop and mobile devices.

  • If you want to showcase your page through photos or put an image on headers you can use this module.
  • Simply rendering the banner and implementing it through different pages can be very easy to apply by using this module on WebEd 9 CMS.

How to manage default banner image

STEP-BY-STEP
  • 1
    Log in as an administrator and go to the Admin Dashboard.
    Learn how to log in here →
  • 2
    Go to Admin → File Manager
    Image Banner
  • 3
    Go to Page Images
    Image Banner
  • 4
    Look for default.jpg > Right click and rename to {filename}-backup.jpg
    Image Banner
  • 5
    Rename the image you will upload to "default.jpg"
  • 6
    Go to Upload a File > Upload the updated default image
    Image Banner

How to manage Header images on webpages

By default, all the Porsche sites have an default image header.

  • If no specific header image is chosen, then the default image will appear
Header Image

You can change the image header for any individual page by uploading your new replacement image to your Page Images folder.
This can be managed from the website front end.

Before you start it's a good idea to be prepared:

  • Have your replacement image ready to upload. Make sure the image is the correct size and optimised for the website.
  • Make sure the new image is named correctly, it needs to be the same as the page url.
    • For example:
      • Page URL - www.domain.name.com/Our-Team
      • Image name - Our-Team.jpg
  • Make sure that the file format of the image is JPG (.jpg)
  • Recommended image dimension is: 1920 x 738 px.
     
STEP-BY-STEP
  • 1
    Go to the page you wish to add the new header image
  • 2

    Edit the page - when the page opens

    • Go to the image icon and open the File Browser
  • 3

    Within the File Browser, look for the Page-Images folder
    IMPORTANT: Big Images can only work from this folder

    header image

IMPORTANT: The name of your new image header has to be exactly the same as the url of the page BUT if you are replacing an existing image - you need to rename or delete the existing image first. The system does not like it when there are two images with the same name.

Naming Examples:

Make sure your image is named the same as the page on which you want it to appear
For example:

  • Parts-and-Service.jpg / Calendar-of-Events.jpg etc.
  • NB: also remember to include the dashes in between each word
header image
  • Once you have renamed or deleted the existed image - UPLOAD your new Header image
  • When it is safely uploaded and named correctly - simply EXIT AWAY FROM THE FOLDER and DO NOT SELECT

NB: You do not need to select, simply exit out of the Browser and Image folder, SAVE the page you are working on and refresh

Your new image ought to appear - if it does not, clear your cache (Control + F5) and check again

If is still does not appear, check in the Page-images folder to ensure the image names matches the friendly URL exactly and adjust if required.

Create a Banner Image in Admin

STEP-BY-STEP
  • 1
    Log in as an administrator and go to the Admin Dashboard.
    Learn how to log in here →
  • 2
    On the left nav panel, select the Banners module
  • 3
    Click "Create New" button
    Banner pages
  • 4
    Upload the image, text, URL and Banner Group name and click on the Save button to continue
    banner pages
    banner pages
  • 5
    You can see the list of banners now
    banner pages

How to insert Banner Images on the page

This can help in selling advertising space or promoting user products

STEP-BY-STEP
  • 1
    Log in as an administrator and go to the Admin Dashboard.
    Learn how to log in here →
  • 2
    On the page editor, select the Curly Bracket icon and click the Configure button
    banner pages
  • 3
    Search for "Banner" and select the Banner module from the result
    banner pages
  • 4
    Select the banner name on the left side of the modal box
    banner pages
  • 5
    Click OK in configure
    banner pages
  • 6
    click Save and see the result on the Frontend
    banner pages

Creating New Rotating Image Template

STEP-BY-STEP
  • 1
    Log in as an administrator and go to the Admin Dashboard.
    Learn how to log in here →
  • 2
    On the left nav panel, look for System Settings module
  • 3
    Select Module Management and click the Curly Brackets Tags
  • 4
    Search the keyword "Rotating Images"
    Rotating Images
  • 5
    Click "+" to Create new template
    Rotating Images
  • 6
    Add {RotatingImages.Home.Slider} to your desired location
  • 7
    The curly bracket It's meaning of Curly Brackets {1_2_3} parameters:
    No. Name Description
    1 Curly Brackets name
    2 Rotating Image group id
    3 Rotating Image group name