using MrKDilkington - Full Screen Background Image and Overlay

Permalink Browser Info Environment
Is it possible to use "MrKDilkington - Full Screen Background Image and Overlay" on this theme?
Tried it but no effect.

Type: Discussion
Status: Resolved
View Replies:
pilipala replied on at Permalink Reply

I haven't tried using this add on with Seren, but you may need to make changes to the theme CSS. You could have a look at it using Firefox inspector

If you would like to send a link, I can have a look. Please note this support thread is public, so if you want to send the link privately, please send it by pm or email [email protected]


peel1962 replied on at Permalink Reply
It would be great if you could have a look.
URL is
I tried to use it on the subpages, not the homepage.
pilipala replied on at Permalink Reply
Thank you. I will have a look at it a bit later, and get back to you.

pilipala replied on at Permalink Reply

To show the main area with the background image, you just need to make the theme background transparent for that page.

You can do this in the design panel on that page by selecting the x option (top right) for the background colour in the customise theme panel where it says Page Background under Body. Click on the cog (top left of concrete5 toolbar) > design > customise theme. Change the background colour to x select choose, and then save changes > this page.

If you prefer, you can do it by adding custom CSS. The code to make the page brackground transparent is:
div.ccm-page {
    background: transparent;

If you wanted to target a particular page, you could add the id of the page, eg:
#page406 div.ccm-page {
    background: transparent;

I don't know if you would want the background to show everywhere, including the banner area and the footer? If so, it is a similar thing, you would need to make any backgrounds and borders transparent either in the customise theme panel, or by adding custom CSS, e.g.

#page406 div.ccm-page {
    background: transparent;
#page406 div.ccm-page #seren-banner {
    border-bottom: none;
#page406 .footer #seren-top-footer {
    background-color: transparent;
#page406 .footer #seren-bottom-footer {
     background-color: transparent;
#page406 .jumbotron {
     background-color: transparent;


peel1962 replied on at Permalink Reply
OK, I will try this.
Thank you for fast support.
pilipala replied on at Permalink Reply
You're welcome :)

concrete5 Environment Information

# concrete5 Version
Core Version - 8.4.2
Version Installed - 8.4.2
Database Version - 20180716000000

# concrete5 Packages
Background Image and Overlay (0.9.9), Seren (1.0.2)

# concrete5 Overrides

# concrete5 Cache Settings
Block Cache - On
Overrides Cache - On
Full Page Caching - Off
Full Page Cache Lifetime - Every 6 hours (default setting).

# Server Software

# Server API

# PHP Version

# PHP Extensions
bcmath, bz2, calendar, Core, ctype, curl, date, dom, ereg, exif, fileinfo, filter, ftp, gd, gettext, hash, iconv, imap, intl, json, libxml, litespeed, mbstring, mcrypt, memcache, mhash, mysql, mysqli, mysqlnd, openssl, pcntl, pcre, PDO, pdo_mysql, pdo_pgsql, pdo_sqlite, pgsql, Phar, posix, Reflection, session, shmop, SimpleXML, soap, sockets, SPL, sqlite3, standard, tokenizer, turbo_realpath, XCache, XCache Cacher, xml, xmlreader, xmlrpc, xmlwriter, xsl, Zend OPcache, zip, zlib

# PHP Settings
max_execution_time - 3000
log_errors_max_len - 1024
max_file_uploads - 100M
max_input_nesting_level - 64
max_input_time - 60
max_input_vars - 5000
memory_limit - 1024M
post_max_size - 100M
sql.safe_mode - Off
upload_max_filesize - 100M
memcache.max_failover_attempts - 20
mysql.max_links - Unlimited
mysql.max_persistent - Unlimited
mysqli.max_links - Unlimited
mysqli.max_persistent - Unlimited
pcre.backtrack_limit - 1000000
pcre.recursion_limit - 100000
pgsql.max_links - Unlimited
pgsql.max_persistent - Unlimited
session.cache_limiter - <i>no value</i>
session.gc_maxlifetime - 7200
soap.wsdl_cache_limit - 5
RealPath safe mode - <i>no value</i>
realpath_cache_safe_mode - <i>no value</i>
xcache.var_maxttl - 0
opcache.max_accelerated_files - 4000
opcache.max_file_size - 0
opcache.max_wasted_percentage - 5

Browser User-Agent String

Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_6) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/11.1.2 Safari/605.1.15

Hide Post Content

This will replace the post content with the message: "Content has been removed by an Administrator"

Hide Content

Request Refund

You may not request a refund that is not currently owned by you.