The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

Add an Image to the Header Punbb

View previous topic View next topic Go down

Solved Add an Image to the Header Punbb

Post by runawayhorses on June 12th 2013, 8:51 pm

Hi, I have a new forum version punbb and I'm trying to figure out how to add a small gif image at the top right-hand side of the header. I have the area marked with a red X where I would like to place the image. I'm new to punbb template editing and nothing I tried worked so far. Anyone know of the best way to go about this? thanks




http://i80.servimg.com/u/f80/12/28/94/48/sshead11.jpg


Last edited by runawayhorses on June 13th 2013, 2:50 pm; edited 1 time in total

runawayhorses
Hyperactive

Male Posts : 2537
Reputation : 162
Language : English
Location : United States

http://runawayhorses.alldiscussion.net/

Back to top Go down

Solved Re: Add an Image to the Header Punbb

Post by nasko7 on June 12th 2013, 9:23 pm

You cannot add one more image.
But you'll can, if you edit your logo. Smile

nasko7
Forumember

Male Posts : 99
Reputation : 1
Language : Bulgarian

http://www.bgminecrafters.bulgarianforum.net

Back to top Go down

Solved Re: Add an Image to the Header Punbb

Post by runawayhorses on June 12th 2013, 11:09 pm

The logo already as an image thats the text image you see on the left. Yes there is a way to add an another image to the right.

runawayhorses
Hyperactive

Male Posts : 2537
Reputation : 162
Language : English
Location : United States

http://runawayhorses.alldiscussion.net/

Back to top Go down

Solved Re: Add an Image to the Header Punbb

Post by Richard. on June 12th 2013, 11:40 pm

Sure you can, what is the image that you want up there?

Richard.
Forumember

Male Posts : 248
Reputation : 12
Language : English,Romanian
Location : Durham, NC - USA.

http://forum.phpbbonline.com/

Back to top Go down

Solved Re: Add an Image to the Header Punbb

Post by runawayhorses on June 13th 2013, 12:14 am

Does it matter? I'd prefer to not post it right now.

runawayhorses
Hyperactive

Male Posts : 2537
Reputation : 162
Language : English
Location : United States

http://runawayhorses.alldiscussion.net/

Back to top Go down

Solved Re: Add an Image to the Header Punbb

Post by Spyro Dragon™ on June 13th 2013, 12:22 am

Theres a way you can Add the imiage and make it disapeer too , kinda like this.
Look at the picture for a minute...something should pop up verry slow, and then disapeer.
I had this for my website a long time ago.


Spyro Dragon™
Forumember

Male Posts : 202
Reputation : 2
Language : English

http://SpyroDragon.com

Back to top Go down

Solved Re: Add an Image to the Header Punbb

Post by runawayhorses on June 13th 2013, 1:08 am

that's otherwise known as a animated gif image.

I'm looking for a code to place in the template or CSS code.

runawayhorses
Hyperactive

Male Posts : 2537
Reputation : 162
Language : English
Location : United States

http://runawayhorses.alldiscussion.net/

Back to top Go down

Solved Re: Add an Image to the Header Punbb

Post by Spyro Dragon™ on June 13th 2013, 1:13 am

Im not sure what your trying to ask for, can you edite this through photoshop and and screenshot of what your trying to do with the site?


Last edited by Spyro Dragon™ on June 13th 2013, 1:23 am; edited 1 time in total

Spyro Dragon™
Forumember

Male Posts : 202
Reputation : 2
Language : English

http://SpyroDragon.com

Back to top Go down

Solved Re: Add an Image to the Header Punbb

Post by Spyro Dragon™ on June 13th 2013, 1:22 am

Try cutting your picture, and putting the rest of your picture into this code.

Code:
<a href=WEBSITELINK><img src=BUTTONPICTURE></a>

Spyro Dragon™
Forumember

Male Posts : 202
Reputation : 2
Language : English

http://SpyroDragon.com

Back to top Go down

Solved Re: Add an Image to the Header Punbb

Post by Richard. on June 13th 2013, 2:20 am

alright .. i dont see anything wrong with giving me the imagine,but making my job harder, here ill make a cod.

put this in overall_header

Code:
<div class="second-image"><img src="LINK IMAGE"></div>



CSS:


Code:
.second-image{
height: 0px;
position: relative;
float: right;
}

after you put this code, let see your site to see how to change the code to make ur imagine in da place u want.

Richard.
Forumember

Male Posts : 248
Reputation : 12
Language : English,Romanian
Location : Durham, NC - USA.

http://forum.phpbbonline.com/

Back to top Go down

Solved Re: Add an Image to the Header Punbb

Post by SLGray on June 13th 2013, 2:53 am

Spyro Dragon™ wrote:Im not sure what your trying to ask for, can you edite this through photoshop and and screenshot of what your trying to do with the site?


Spyro Dragon™ wrote:Try cutting your picture, and putting the rest of your picture into this code.

Code:
<a href=WEBSITELINK><img src=BUTTONPICTURE></a>
Please do not double/triple post. Use the edit button.

Second Reminder


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 35629
Reputation : 2372
Language : English
Location : United States

http://fmthemes.forumotion.com/

Back to top Go down

Solved Re: Add an Image to the Header Punbb

Post by runawayhorses on June 13th 2013, 3:11 am

@ Richard, thank you I tried your code but nothing showed. I tried adding the image the header same place you suggested but it just seems to be the wrong place. I add it before the closing body and html tags.

I don't get it..

runawayhorses
Hyperactive

Male Posts : 2537
Reputation : 162
Language : English
Location : United States

http://runawayhorses.alldiscussion.net/

Back to top Go down

Solved Re: Add an Image to the Header Punbb

Post by Richard. on June 13th 2013, 4:16 am

Code:
<div class="second-image"><img src="LINK IMAGE"></div>



   
Code:
.second-image{
    height: 0px;
    position: relative;
    top: -100px;
right: -500px;
    }

Richard.
Forumember

Male Posts : 248
Reputation : 12
Language : English,Romanian
Location : Durham, NC - USA.

http://forum.phpbbonline.com/

Back to top Go down

Solved Re: Add an Image to the Header Punbb

Post by runawayhorses on June 13th 2013, 4:44 am

No it wasn't the CSS positioning I know how to write css, and I know how to write ID classes, thank you. I think its another issue that has to do with location within the template.

runawayhorses
Hyperactive

Male Posts : 2537
Reputation : 162
Language : English
Location : United States

http://runawayhorses.alldiscussion.net/

Back to top Go down

Solved Re: Add an Image to the Header Punbb

Post by Mr.EasyBB on June 13th 2013, 4:54 am

Runawayhorses my friend, simple as asking me Very Happy

Go to ACP>DISPLAY>TEMPLATES>GENERAL>OVERALL_HEADER

Find this code

Code:
<div id="pun-intro" class="clearfix">
<a href="{U_INDEX}" id="pun-logo"><img src="{LOGO}" alt="{L_INDEX}" /></a>
<!-- BEGIN switch_h1 -->
<div id="pun-title">{switch_h1.MAIN_SITENAME}</div>
<!-- END switch_h1 -->
<!-- BEGIN switch_desc -->
<p id="pun-desc">{switch_desc.SITE_DESCRIPTION}</p>
<!-- END switch_desc -->
</div>

Change to this

Code:
<div id="pun-intro" class="clearfix">
<a href="{U_INDEX}" id="pun-logo"><img src="{LOGO}" alt="{L_INDEX}" /></a>
<img class="animate" src="yourSRC" title="yourTITLE" />
<!-- BEGIN switch_h1 -->
<div id="pun-title">{switch_h1.MAIN_SITENAME}</div>
<!-- END switch_h1 -->
<!-- BEGIN switch_desc -->
<p id="pun-desc">{switch_desc.SITE_DESCRIPTION}</p>
<!-- END switch_desc -->
</div>

Now change the yourSRC and yourTITLE

Add this CSS


Code:
#pun-intro{position:relative}
.animate{position:absolute;right:10px;top:5px;display:block}

Now if the image doesn't show let me know ok man

Mr.EasyBB
Forumember

Posts : 69
Reputation : 9
Language : HTML/CSS/JS/JQUERY/MOOTOOLS

http://www.avacweb.com

Back to top Go down

Solved Re: Add an Image to the Header Punbb

Post by runawayhorses on June 13th 2013, 2:49 pm

Thanks Easy that worked like a charm! Yeah I would have asked you but you were kinda busy so I thought I'd come here and ask it.. lol

So it was location within the template I thought so. Smile

thanks again,

runawayhorses
Hyperactive

Male Posts : 2537
Reputation : 162
Language : English
Location : United States

http://runawayhorses.alldiscussion.net/

Back to top Go down

Solved Re: Add an Image to the Header Punbb

Post by Sanket on June 13th 2013, 4:12 pm

Topic Solved & Archived.

Sanket
ForumGuru

Male Posts : 48766
Reputation : 2819
Language : English
Location : Mumbai

http://webartzforum.com

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum