Back Ground Image

For discussion and questions related to CMS Specific templates and stylesheets (CSS), and themes. or layout issues. This is not a place for generic "I don't know CSS issues"
Post Reply
Barrowboy
Forum Members
Forum Members
Posts: 196
Joined: Mon Dec 16, 2013 4:09 pm

Back Ground Image

Post by Barrowboy »

Hi
Can anyone explain how I can show an image in the background of the page but not in admin when editing.

My CSS at the moment is:

body {
background-image:url(https://www.mysite/uploads/images/body-bg.jpg);
background-repeat:repeat;
}

The problem is the image shows when editing a page which makes it difficult to add text etc. I would like to remove it from admin.

Thanks
User avatar
paulbaker
Dev Team Member
Dev Team Member
Posts: 1455
Joined: Sat Apr 18, 2009 10:09 pm
Location: Maidenhead, UK
Contact:

Re: Back Ground Image

Post by paulbaker »

One way: If you use TinyMCE (find out at My Preferences > My Account > User Preferences > Select WYSIWYG to use).

Then: Extensions > TinyMCE WYSIWYG editor and have a look around there (can't find an installation with TinyMCE at the moment to give you further details). Pretty sure there is an option to add specific CSS.
To copy System Information to the forum:
https://docs.cmsmadesimple.org/troubles ... nformation

CMS Made Simple Geekmoots attended:
Nottingham, UK 2012 | Ghent, Belgium 2015 | Leicester, UK 2016
Barrowboy
Forum Members
Forum Members
Posts: 196
Joined: Mon Dec 16, 2013 4:09 pm

Re: Back Ground Image

Post by Barrowboy »

Hi
Yes there is an option to add CSS in Tinymce which we are already using, but these only affect the content page you are edit at the time.


I am trying to remove/hide a background image from Tinymce admin which shows in the editor while editing a page which prevents from seeing the text.

Thanks
User avatar
velden
Dev Team Member
Dev Team Member
Posts: 3348
Joined: Mon Nov 28, 2011 9:29 am
Location: The Netherlands

Re: Back Ground Image

Post by velden »

The options Paul mentions should be what you're looking for.

Another approach could be to use the browser's inspector to find a specific class for the editor. (could be something like .tinymce) and override the background in your css

e.g.
.tinymce body {background: none;}
Post Reply

Return to “Layout and Design (CSS & HTML)”