mini-aem-demo

Mini AEM demo showing content editing and live preview.

This is a mini Adobe Experience Manager (AEM)-inspired project designed to demonstrate basic digital content editing and preview functionality. It simulates a simplified AEM workflow, allowing users to:

• Edit the title and text for different homepage sections (Land, Sea, Air).

• Upload images for each section.

• Upload a background image that appears behind all sections.

• See changes immediately in a live preview without refreshing the page.

---

Features:

Admin Panel: Allows temporary content edits and image uploads.

Live Preview: Updates in real time to reflect changes made in the admin panel.

Background Image Upload: Users can upload a background image for the homepage.

Responsive Layout: Sections are centered and adapt to smaller screens.

Hover Effects: Sections slightly zoom when hovered, mimicking interactive brand experiences.

assets/ folder: Contains static files, like images used by the homepage sections. placeholder/ images: Default images for each section. They are replaced when a new image is uploaded via the admin panel.

How to Use:

1. Clone the repository

2. Open admin.html to go straight to admin page to update page or can open index.html to go to homepage and then press "go to admin panel" button to go to admin page.

3. Edit Sections:

   • Select a section (Land, Sea, Air).

   • Update the title and text.

   • Upload a new section image (optional).

4. Upload a Background Image (optional) to see changes in the live preview.

5. Preview changes live in the preview panel.

---

Note: Changes are temporary and only affect the live preview; no backend is included. This project is intended for portfolio/demo purposes to showcase familiarity with digital content management concepts.

For a full AEM experience with persistent data, a backend and database would be required.