Author Topic: Standard logo and changing background  (Read 6526 times)

Offline Hans

  • Posts: 914
  • Gender: Male
Standard logo and changing background
« on: November 18, 2012, 04:48:43 PM »
Hello fellow WB users,

I have found something like the following code here on the forum and I use it in combination with sections to give my customers an easy way to change header-images. When noting is set in a headersection with code
Code: [Select]
page_content(2) the default image (here: standardheader.jpg) appears.

Code: [Select]
<?php
ob_start
();
page_content(2);
$out1 ob_get_contents();
ob_end_clean();
if(empty(
$out1)) {
echo 
'<img src="http://www.awebsite.nl/media/headers/standardheader.png" alt="A website title" />';
} else { echo 
$out1; }
?>

Now I am asked if it is possible to do the same but then to change the image not as "plain image" but as background-image. The client wants to place a logo over that background-image. That way he doesn't have to make headers-with-logo's but only one logo-image in the template that appears over the changing background header-images ;-)

Is that possible and is someone willing to share the code?
Thanks in advance
Hans
Hans - Nijmegen - The Netherlands

Offline Argos

  • Posts: 2542
  • Gender: Male
    • Argos Media
Re: Standard logo and changing background
« Reply #1 on: November 22, 2012, 12:56:50 AM »
Try changing this:

Code: [Select]
<?php
ob_start
();
page_content(2);
$out1 ob_get_contents();
ob_end_clean();
if(empty(
$out1)) {
echo 
'<img src="http://www.awebsite.nl/media/headers/standardheader.png" alt="A website title" />';
} else { echo 
$out1; }
?>

to this:

Code: [Select]
<?php
ob_start
();
page_content(2);
$out1 ob_get_contents();
ob_end_clean();
if(empty(
$out1)) {
echo 
'<div style="background:url(http://www.awebsite.nl/media/headers/standardheader.png) 0 0 no-repeat;width:123px;height:123px;"></div>';
} else { echo 
'<div style="background:url('.$out1.') 0 0 no-repeat;width:123px;height:123px;"></div>'; }
?>
You have to change 123px to the right size of your header. An empty DIV needs dimensions to show up.

Not tested though!
Jurgen Nijhuis
Argos Media
Heiloo, The Netherlands
----------------------------------------------------------------
Please don't request personal support, use the forums!

Offline Hans

  • Posts: 914
  • Gender: Male
Re: Standard logo and changing background
« Reply #2 on: November 22, 2012, 09:52:44 AM »
Hello Jurgen

thanks for your code! Unfortunately there seems to be an error in it, please look at the attached screenshot. I changed both width and heigt to the real dimensions. Hope you can find a solution!
Hans
Hans - Nijmegen - The Netherlands

Offline nibz

  • Posts: 684
  • Gender: Male
Re: Standard logo and changing background
« Reply #3 on: November 22, 2012, 10:27:49 AM »
I think the error is that the WYSIWYG by default put <img src="URL"> in.
And for your purpose you only need the url of the image. Not the whole img scr.

Offline Argos

  • Posts: 2542
  • Gender: Male
    • Argos Media
Re: Standard logo and changing background
« Reply #4 on: November 22, 2012, 11:15:19 AM »
Yes, of course, I should have tought about that. Hm... I'm sure there must be some solution. Let me think about it.
Jurgen Nijhuis
Argos Media
Heiloo, The Netherlands
----------------------------------------------------------------
Please don't request personal support, use the forums!

Offline Argos

  • Posts: 2542
  • Gender: Male
    • Argos Media
Re: Standard logo and changing background
« Reply #5 on: November 22, 2012, 11:29:45 AM »
Not the same method, but the same result is to let your clients upload a header with a fixed name, for example "header-alt.jpg" to some Media-folder and call that image directly with the function below.

Code: [Select]
<?php
if (file_exists('http://www.awebsite.nl/media/headers/header-alt.jpg') ) {
echo 
'<div style="background:url(http://www.awebsite.nl/media/headers/header-alt.jpg) 0 0 no-repeat;width:123px;height:123px;"></div>';
} else { echo 
'<div style="background:url(http://www.awebsite.nl/media/headers/standardheader.png) 0 0 no-repeat;width:123px;height:123px;"></div>'; }
?>

Not tested  :roll:
Jurgen Nijhuis
Argos Media
Heiloo, The Netherlands
----------------------------------------------------------------
Please don't request personal support, use the forums!

Offline nibz

  • Posts: 684
  • Gender: Male
Re: Standard logo and changing background
« Reply #6 on: November 22, 2012, 02:40:58 PM »
I think this will also not work. Because it will allways try to load the alt image.
There is no check if there is or isn't a image.

I think your initial idea will work with some additional javascript to remove <img src" and ">.
To obtain only the url of the image.

But i'm no javascript expert

Offline Argos

  • Posts: 2542
  • Gender: Male
    • Argos Media
Re: Standard logo and changing background
« Reply #7 on: November 22, 2012, 03:36:51 PM »
There is no check if there is or isn't a image.

But there is a check, isn't there? IF the alternative image exists, THEN use that image as background. IF the alternative image NOT exists, THEN show the regular image as background.
Jurgen Nijhuis
Argos Media
Heiloo, The Netherlands
----------------------------------------------------------------
Please don't request personal support, use the forums!

Offline nibz

  • Posts: 684
  • Gender: Male
Re: Standard logo and changing background
« Reply #8 on: November 22, 2012, 06:15:11 PM »
My bad. It checks for the alt file.

Offline Hans

  • Posts: 914
  • Gender: Male
Re: Standard logo and changing background
« Reply #9 on: November 23, 2012, 11:09:48 AM »
Interesting question isn't it ;-)

It's now a pure academic one because the client has decided to use different images with the logo on it (can be inserted as shown in the first post), but maybe (and I hope) someone finds a way nevertheless, because it could bring a multi-face site with only one template a step nearer.
Thanks for your contributions so far!
Hans
Hans - Nijmegen - The Netherlands

Offline nibz

  • Posts: 684
  • Gender: Male
Re: Standard logo and changing background
« Reply #10 on: November 28, 2012, 01:01:26 PM »
Attached a edited version of Ruud's minigallery.
You can only upload one image per gallery (the background image)

By default the logo in front of the background has to be media/logo.png
You could change this in the frontend.php if you really want to.

In your template use: (please notice i use block 2!)
Code: [Select]
<?php 
ob_start
();
page_content(2);
$out1 ob_get_contents();
ob_end_clean();

if((
strlen($out1) < 60) && (substr($out1,0,2) == '<a') && (substr($out1,-4) == '</a>')) {
echo 
'YOUR DEFAULT CONTENT'
} else { echo 
$out1; }
?>


Where you have to replace the YOUR DEFAULT CONTENT placeholder by your own content.

A little demo over here:
nothing uploaded: http://slaaptotaal.com/addons/pages/no-image.php
with background uploaded: http://slaaptotaal.com/addons/pages/with-image.php

BTW the image you upload has to be JPG

Good luck :)

P.s. you can change the height and width of the background image in frontend.css

07 DEC - VERSION .0.3  ! Important please first remove previous versions installed, before installing this version

Note: This is an experimental module, for academic purpose!
I used Minigallery as a base, since i am not a PHP expert i will not be able to solve al your questions..
« Last Edit: December 07, 2012, 12:46:08 PM by nibz »

Offline Hans

  • Posts: 914
  • Gender: Male
Re: Standard logo and changing background
« Reply #11 on: November 28, 2012, 10:34:37 PM »
Hi nibz
I sent you a PM to thank you but want to do that here too ;-). I'll give it a try next week and let you know!
Thanks again
Hans
Hans - Nijmegen - The Netherlands

Offline nibz

  • Posts: 684
  • Gender: Male
Re: Standard logo and changing background
« Reply #12 on: November 28, 2012, 11:39:46 PM »
Read the PM ... curious what you think about it :)

Offline nibz

  • Posts: 684
  • Gender: Male
Re: Standard logo and changing background
« Reply #13 on: December 04, 2012, 08:08:16 PM »
Updated the file, there was an error.
The background image wasn't visible on some browsers due to a missing ' in the view.php, please update the module

Offline Hans

  • Posts: 914
  • Gender: Male
Re: Standard logo and changing background
« Reply #14 on: December 04, 2012, 11:15:31 PM »
Thanks!! gonna give it try this week.
Hans
Hans - Nijmegen - The Netherlands

Offline Argos

  • Posts: 2542
  • Gender: Male
    • Argos Media
Re: Standard logo and changing background
« Reply #15 on: December 05, 2012, 11:42:01 AM »
Did you try my solution, it's much easier...
Jurgen Nijhuis
Argos Media
Heiloo, The Netherlands
----------------------------------------------------------------
Please don't request personal support, use the forums!

Offline nibz

  • Posts: 684
  • Gender: Male
Re: Standard logo and changing background
« Reply #16 on: December 05, 2012, 12:20:23 PM »
He Argos...
I know your solution is easier, but if you want a different image on multiple pages you have to make different templates or you have to work with e.g. PAGE_ID or PAGE_TITLE.
By default your solution can have just one alternative.

With mine you can have just one template, and for the user it's iintuitive, and i think that in Hans's case he wants more variations on different pages..

A while ago for a site i am maintaining i usede the page id and some css to style this like body.page-id12{},
But for a user this is difficult..

But my solution is a little playin' around :)
« Last Edit: December 05, 2012, 12:25:39 PM by nibz »

Offline Argos

  • Posts: 2542
  • Gender: Male
    • Argos Media
Re: Standard logo and changing background
« Reply #17 on: December 05, 2012, 12:41:53 PM »
Nibz, I agree with you  :-D
Jurgen Nijhuis
Argos Media
Heiloo, The Netherlands
----------------------------------------------------------------
Please don't request personal support, use the forums!

Offline Hans

  • Posts: 914
  • Gender: Male
Re: Standard logo and changing background
« Reply #18 on: December 06, 2012, 07:55:07 PM »
Hi Argos
I couldn't explain much better than nibz did ;-). Sorry didn't have time to respond earlier on your question,
Hans
Hans - Nijmegen - The Netherlands

Offline Argos

  • Posts: 2542
  • Gender: Male
    • Argos Media
Re: Standard logo and changing background
« Reply #19 on: December 06, 2012, 09:24:35 PM »
No probs  :-D
Jurgen Nijhuis
Argos Media
Heiloo, The Netherlands
----------------------------------------------------------------
Please don't request personal support, use the forums!

 

postern-length