Changing Images on the Website
Follow the steps below to replace images correctly without breaking the website layout.
1. Locate the Image
All website images are stored in the assets/images/
directory. The images are organized as follows:
assets/images/favicon.png
- Favicon imageassets/images/icon-192x192.png
,assets/images/icon-512x512.png
- App iconsassets/images/loading.gif
- Loading animationassets/images/logo.png
,assets/images/logo-white.png
- Website logosassets/images/why-us.webp
,assets/images/contact-us.webp
,assets/images/about-us.webp
- Section imagesassets/images/testimonials-01.webp
- Testimonial section imageassets/images/services/
- Contains service images likeservice1.webp
,service2.webp
assets/images/sliders/
- Contains slider images likeslider-01.webp
,slider-02.webp
2. Replacing an Image
To update an image, replace the existing file in the corresponding folder with your new image. Make sure the new image has the same filename as the original one.
3. Keeping the Same Image Name
The website dynamically loads images based on predefined filenames. If you rename the image, it will not be displayed since the website will not recognize the new name.
4. Recommended Image Formats
For optimal performance and compatibility, use one of the following formats:
- PNG - Best for high-quality images and transparency.
- JPG - Suitable for general images with good compression.
- WebP - Preferred format for faster loading and better compression.
5. Automatic Updates
Once you replace an image with the same filename, no additional action is required. The website will automatically reflect the changes.
6. Example: Replacing an Image
If you want to replace an image named service1.webp
, follow these steps:
- Navigate to
assets/images/services/
. - Delete the existing
service1.webp
file. - Upload your new image and name it
service1.webp
.
After completing these steps, your new image will be displayed on the website automatically.
Website Setup Guide
Step-by-step guides on managing your website, hosting, and domain setup.
1. Getting Started
After creating your website with GiviAI, you will receive a ZIP file containing your website files. You can edit, customize, and host your website with ease.
2. Edit Your Website Using VS Code
Follow these steps to edit your website files:
- Download and install Visual Studio Code.
- Extract the ZIP file provided by GiviAI.
- Open VS Code, click File > Open Folder, and select your extracted website folder.
- Edit your HTML, CSS, and JavaScript files as needed.
3. Search and Purchase a Domain
To buy a domain, follow these steps:
- Go to Hostinger or GoDaddy.
- Use the domain search bar to find an available domain.
- Once selected, add it to your cart and proceed with the purchase.
4. Buy Hosting for Your Website
To purchase hosting:
- Go to Hostinger or GoDaddy.
- Select a hosting plan that fits your needs.
- Proceed to checkout and complete the purchase.
5. Host Your Website
To upload and host your website:
- Login to your hosting account.
- Go to the cPanel or Hosting Dashboard.
- Upload your extracted website files to the
public_html
folder using the File Manager or FTP. - Set up your domain to point to your hosting server.
6. Need Further Assistance?
If you have any additional questions, reach out to our support team at support@giviai.com.
Contact Form Configuration
Guide to setting up and troubleshooting your website's contact form.
1. How the Contact Form Works
The contact-us.html
page contains a form that, upon submission, sends data to submit_form.php
.
This PHP file processes the form data and sends an email using SMTP authentication.
2. Default SMTP Configuration
By default, the following SMTP settings are used in submit_form.php
:
$mail->Username = 'noreply@domain.com'; $mail->Password = 'OldPassword';
The default email noreply@domain.com
is used for sending inquiries, and the password is
predefined as OldPassword
. However, for the contact form to deliver messages to your inbox,
you must set up a valid email.
3. Setting Up a Custom Email
To enable contact form inquiries to reach your email inbox, follow these steps:
- Log in to your hosting provider (e.g., Hostinger or GoDaddy).
- Navigate to the Email section and create a new email address (e.g.,
yourname@yourdomain.com
). - Set a strong password for your email.
- Update the SMTP configuration in
submit_form.php
with the new email and password:
$mail->Username = 'yourname@yourdomain.com'; $mail->Password = 'YourNewPassword';
4. Testing Your Contact Form
After updating the email credentials, test the contact form:
- Go to your website's contact page.
- Fill in the form and click submit.
- Check the configured email inbox to see if you received the inquiry.
5. Troubleshooting Issues
If the contact form does not work, check the following:
- Ensure the email and password in
submit_form.php
are correct. - Verify that SMTP settings are enabled in your hosting provider.
- Check the spam folder of your email inbox.
- Enable SMTP authentication if required by your email provider.
Business Email Setup
Comprehensive guide to creating professional business emails with different hosting providers.
1. Create an Email in Hostinger
Follow these steps to create an email account on Hostinger:
- Log in to your Hostinger account.
- Go to the Emails section in the dashboard.
- Click Manage next to your domain.
- Select Create New Email Account.
- Enter your desired email (e.g.,
info@yourdomain.com
) and set a strong password. - Click Create to complete the setup.
For detailed documentation, visit: Hostinger Email Setup Guide
2. Create an Email in GoDaddy
To create an email account on GoDaddy:
- Log in to your GoDaddy account.
- Go to My Products and find the Email section.
- Click Set Up Email.
- Choose your domain and click Create.
- Enter your preferred email address and set a password.
- Click Create to complete the setup.
For detailed documentation, visit: GoDaddy Email Setup Guide
3. Create an Email Using cPanel
If your hosting provider offers cPanel, use the following steps:
- Log in to your cPanel account.
- Go to Email Accounts under the Email section.
- Click Create.
- Enter your email address (e.g.,
info@yourdomain.com
). - Set a secure password.
- Click Create to finish the setup.
For detailed documentation, visit: Access cPanel | Set Up cPanel Email
4. Create an Email in Bluehost
To set up an email in Bluehost:
- Log in to your Bluehost account.
- Go to Email & Office in the control panel.
- Select your domain.
- Click Create Email Account.
- Enter your email ID and password.
- Click Create to finish.
For detailed documentation, visit: Bluehost Email Setup Guide
5. Create an Email in HostGator
To create an email using HostGator:
- Log in to your HostGator cPanel.
- Click Email Accounts under the Email section.
- Click Create.
- Enter your preferred email and set a password.
- Click Create to complete the process.
For detailed documentation, visit: HostGator Email Setup Guide
6. Need Further Assistance?
If you have any issues setting up your email, contact your hosting provider's support team or reach out to our support at support@giviai.com.