Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
  • #26715


    1) You can play with the styling of any element by using Google Chrome Developer Tools Here is a short tutorial.

    2) I don’t understand the concept of following a background image throughout the site, please elaborate and illustrate.

    3) What you should look out to consider the responsiveness ? I am trying to think but nothing happens. I would consider the optimization of media queries in relation to the specifications of the css selectors.

    4) Yes.

    5) Please open /includes/helper-slideshow.php and find line 253 which looks like

    $image = "<a href='".$this->link_overwrite."'>".$image_string."</a>";;

    and change that line to look like

    $image = "<a target='_blank' href='".$this->link_overwrite."'>".$image_string."</a>";

    6) Sorry about closing the other thread but you said Thx! which we interpreted as meaning the solution worked for you. Sorry again.




    Hi Nick,

    Tx for your answer,

    I guess I wasn’t clear enough in my questions. I’ll try to clarify.

    1. TX, I’ll check the tool

    2. I wanted to see if I can place different background for different pages.

    For example- one background for illustrations page, and another for animation page

    3. When placing a background, I need to consider responsiveness.

    Let’s say I use a background of a cute kitty ( I’m not, btw ;) ), and I want the cute kitty’s eye to be place always behind the logo.

    But when using different screen widths, the relations between the site and the background is different. if I narrow my screen the logo would be on the kitty’s ear.

    So – is there a way to constrain the background to the logo in a certain point?

    4. ok

    5. You’re saying that if I paste the code you wrote me, all links in site will open in new tab? What about internal links? (lets say I’m reffering from project page to another page in my site)

    6. About previous thread- I’ts ok, I thought the answer sufficed, and it was ok to close, but then I thought that maybe I can use a more ‘clean’ solution.


    2) You can use the page id css class to add a different image to each page. The page id class is applied to the body element – i.e. use following code

    .page-id-53 #wrap_all {
    background: transparent url('') no-repeat top center;

    to add the background image of Kriesi’s homepage to your “Template Files” page: with the id 53.

    3) That’s not easily possible. Even css3 code like background-size:contain or background-size:cover does not take care of the position of your content. The image will scale behind your content and the relations may vary.

    4) I’d recommend to use a js script in this case – open up angular/js/avia.js and at the very top replace:




    jQuery(".slideshow a").filter(function() {
    return this.hostname && this.hostname !== location.hostname;
    }).attr('target', '_blank');

    It compares the current url with the link url and if it’s an external link (other domain) it will open a new tab/window.

Viewing 4 posts - 1 through 4 (of 4 total)

The topic ‘Header, logo and background’ is closed to new replies.