Image Background On Homepage

shawnlg777 · August 10, 2018, 01:06:06 PM

I was wondering if anyone had any luck putting a background image just on the home page. I would like to place mine just in the main content area. So far I have tried to experiment with placing a class within the "main container" div and the "column_left col-md-3 col-xs-12" on page.tpl. At this point, I can't even get the image to show up using this CSS on the style.css on all all the pages let along exclude it to just the home page.

.backme {
background: url(images/backme.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}

As I have said before my goal is to have the background only to show up on the home page, but at this point, I would like to even get it to show up on every page. I am using the default theme. Thanks in advance for any help!

eCommerce Core · August 10, 2018, 04:50:36 PM

Unfortunately, there is no css class or ID to identify main page
You would need to add some logic to page.tpl template
https://github.com/abantecart/abantecart-src/blob/master/public_html/storefront/view/default/template/common/page.tpl

For instance, you can put below code in the body and limit your CSS to page what you need

Code Select

<body class="<?php echo str_replace("\\", "-", $this->request->get['rt']); ?>">

shawnlg777 · August 11, 2018, 11:29:57 PM

This is a bit over my head. I will try to get some help to make sense out of what you said. I only know a little PHP. Any reason why I can't get the css to work when trying to add an image to the background on every page in the main content area. Do you have any suggestions?

Just a thought I think it would be a great mod to add this option on the next release. Thanks again for your help!

abantecart · August 13, 2018, 10:22:21 PM

I added slightly different solution to v1.2.13

You can copy this file:
https://github.com/abantecart/abantecart-src/commit/8454e581c3775f1659d1ca8e9b9b6a2cc1ba7089

shawnlg777 · October 10, 2018, 06:31:58 PM

Will I need to make adjustments to the CSS then, for a novice can you give me a few more details. Thanks!

Shawn

News:

Image Background On Homepage

shawnlg777

eCommerce Core

shawnlg777

abantecart

shawnlg777