Forum Activity for @douglas

douglas
@douglas
07/06/15 06:22:46AM
2,815 posts

Background Image
Design and Skin Customization

Strumelia:
Cool Douglas!
I know a little html already.
Would you suggest I start by looking through their css, or their w3css first? (w3 is the mobile responsive i assume?)

If you want to learn more HTML, I would suggest starting at the top left link here:

http://www.w3schools.com/

Learn HTML, Learn CSS and then Learn W3.CSS
douglas
@douglas
07/05/15 12:24:49PM
2,815 posts

Advertisement Placement?
Design and Skin Customization

You can still add the ad code to the header and footer and if you only want the ads to show on the home/index page, add this if statement around your ad code...

{if isset($selected) && $selected == 'home'}
Your ad code goes here...
{/if}

that should work for the Ningja skin, for the Elastic skin, you'll want to add this to the top of the index.tpl file in addition to the above code.

{assign var="selected" value="home"}

updated by @douglas: 07/05/15 12:25:32PM
douglas
@douglas
07/05/15 12:19:47PM
2,815 posts

Background Image
Design and Skin Customization

Just add this:

.single_bckgrd {
background:transparent url("{$jrElastic_img_url}/bckgrd.png") no-repeat;
background-size:cover;
padding:0;
margin:0;
}

to one of your .css files in your skins/YOURSKIN/css/ directory.

Probably the site.css would be best, but ultimately it is up to you where you want it to go.
douglas
@douglas
07/04/15 10:02:59AM
2,815 posts

Background Image
Design and Skin Customization

That would depend on what page you want it on.

You can add another CSS element and use that class in a div on the page you want it on.

Something like this:

.single_bckgrd {
background:transparent url("{$jrElastic_img_url}/bckgrd.png") no-repeat;
background-size:cover;
padding:0;
margin:0;
}

Then in the template you want to use this in, you would add div around the page... for example if you have a page named artist.tpl it would look something like this.

{jrCore_include template="header.tpl"}

<div class="single_bckgrd">
    <div class="container">

        <div class="row">

            <div class="col12 last">
                Your template code goes here....
            </div>

        </div>

    </div>
</div>
{jrCore_include template="footer.tpl"}
douglas
@douglas
07/04/15 06:58:26AM
2,815 posts

Background Image
Design and Skin Customization

Glad you got it sorted. :)
douglas
@douglas
07/04/15 06:04:57AM
2,815 posts

Background Image
Design and Skin Customization

Can you SFTP into your site?

The html.css file will need to be modified manually, it isn't something you can do in the ACP > Skins > jrElastic > Styles tab.
douglas
@douglas
07/04/15 05:54:55AM
2,815 posts

Background Image
Design and Skin Customization

Which skin are you using?
douglas
@douglas
07/03/15 03:51:43PM
2,815 posts

Image Slider on Elastic?
Design and Skin Customization

The slide show code is in your skins/jrElastic/index.tpl, you could use that code and put it in a "Template Code" widget.
douglas
@douglas
07/03/15 03:48:49PM
2,815 posts

Background Image
Design and Skin Customization

If you are using a small image, it may not look very well if it is resized to a larger size. If it were me, I would make the background image as large as you need/want it. You can also change the repeat to no-repeat in the CSS file were the background image is being called.

For example, if your using the Ningja skin, in your skins/jrNingja/css/site.css, change this:

#wrapper {
    margin:0 auto;
    background-color: #C7C7C7;
    background-image: url('{$jrNingja_img_url}/wrapper_bckgrnd.png');
    background-attachment: fixed;
    background-position: left top;
    background-size: initial;
    background-repeat: repeat-x;}

to this:

#wrapper {
    margin:0 auto;
    background-color: #C7C7C7;
    background-image: url('{$jrNingja_img_url}/wrapper_bckgrnd.png');
    background-attachment: fixed;
    background-position: left top;
    background-size: initial;
    background-repeat: no-repeat;}

You may also want to change the background-size element to cover instead of initial.
  144