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.

Side bar ( Facebook, YouTube etc. )

View previous topic View next topic Go down

Side bar ( Facebook, YouTube etc. )

Post by nojzer on April 18th 2014, 1:04 pm

Hi guys, i would like to add this side bar to my forum, but i need code :)if you like to help me


nojzer
New Member

Posts : 17
Reputation : 1
Language : Croatian

Back to top Go down

Re: Side bar ( Facebook, YouTube etc. )

Post by Luffy on April 18th 2014, 3:17 pm

Where did u see this? Can you post a link of the site you saw this?






Luffy
Manager
Manager

Male Posts : 4035
Reputation : 407
Language : Greek, English
Location : Greece

http://www.thinktankforum.net

Back to top Go down

Re: Side bar ( Facebook, YouTube etc. )

Post by J0k3R^ on April 18th 2014, 3:38 pm

u can make something similar but i think the picture is not from a forumotion forum.
u want something similar? (facebook, twitter and more stuff in the sidebar)

J0k3R^
Forumember

Male Posts : 742
Reputation : 28
Language : Greek > English > Russian > Spanish
Location : C:\>r00t

http://fmplanet.forumgreek.com

Back to top Go down

Re: Side bar ( Facebook, YouTube etc. )

Post by nojzer on April 18th 2014, 3:50 pm

This is the site where i saw it
http://e-sport.hr/

i will appreciate everything Smile but.. i think i saw it on some forumotion forums as well

nojzer
New Member

Posts : 17
Reputation : 1
Language : Croatian

Back to top Go down

Re: Side bar ( Facebook, YouTube etc. )

Post by Pizza Boi on April 18th 2014, 4:16 pm

Hi Very Happy

I'd link you to an AvacWeb topic since threatening loads of it there... Or you can search here lol (My phone net too weak pro)

Though if you want it directed in a specific Page, Imma give it a try:

#1 Create a new widget in ACP < Modules < Widgets Management (Make sure widgets are on for your forum) < Post this here (Don't make it as a table) before saving

Code:
<div id="sociallinks"><a href="URL"><img src="IMG Link /><a href="URL"><img src="IMG Link /></div>

You can increase the number of <a href="URL"><img src="IMG Link /> to how many you want. I recommend using IMGs instead so the icons already somewhat styled; moreover, you have to change URL to the place you want it linked as well as the IMG Link to the link of the click-able. Lastly, you can use text in place of IMGs.

#2 Once you're done, place it in an area where widgets are active and then save before posting the code below in the CSS:

Code:
#sociallinks {
  background: #color;
  padding: #px #px #px #px;
  margin: #px #px #px #px;
  position: fixed;
  left: 10px;
  top: 250px;
}

You can add other styles Smile . Don't forget to change the #px value and #color value to the one you like.

Regards,
Pizza Boi

Pizza Boi
Hyperactive

Male Posts : 2016
Reputation : 160
Language : French
Location : Pizza Hut!

http://redlustempire.forumtl.com/

Back to top Go down

Re: Side bar ( Facebook, YouTube etc. )

Post by J0k3R^ on April 18th 2014, 4:17 pm

damn man.. i had a very cool bar but it seems that i deleted the codes from my pc.
anyway, i wrote some fast codes:

CSS:


Code:
#SlideJoker {
    padding-right: 5px;
    right: 0;
    top: 130px;
    position: fixed;
    width: 32px;   
}

Homebox (A/P → Display → Homepage)

Code:
<ul id="SlideJoker">
   
   <li><a title="Like On Facebook" href="http://www.facebook.com"><img src="http://icons.iconarchive.com/icons/hopstarter/social-networking/32/Facebook-icon.png"></a></li>
   
   <li><a title="Follow on Twitter" href="http://www.twitter.com"><img src="http://icons.iconarchive.com/icons/hopstarter/social-networking/32/Twitter-icon.png"></a></li>
   
   <li><a title="Subscribe on Youtube" href="http://www.youtube.com"><img src="http://icons.iconarchive.com/icons/graphics-vibe/classic-3d-social/32/youtube-icon.png"></a></li>
</ul>

U can add more buttons, just remember the size should be 32px

J0k3R^
Forumember

Male Posts : 742
Reputation : 28
Language : Greek > English > Russian > Spanish
Location : C:\>r00t

http://fmplanet.forumgreek.com

Back to top Go down

Re: Side bar ( Facebook, YouTube etc. )

Post by nojzer on April 18th 2014, 4:49 pm

this is not exactly what i want, i found code but it need some improvement
here it is:
CSS
Code:
}
.footer_sponzori3 {
background: rgb(34, 34, 34);
height: 61px;
margin-right: 358px;
margin-left: 358px;
margin-top: -10px;
position: absolute;
}

#footer_sponzori2 {
 padding: 22px;
 text-align: center;
 color: #D2D2D2;
 font-size: 13px;
  background:#202020;
  margin-top: 0px;
}

.footer_sponzori2_slike {
width: 135px;
filter: alpha(opacity=60);
opacity: .6;
-webkit-transition: .4s;
-moz-transition: .4s;
-o-transition: .4s;
transition: .4s;
}

.footer_sponzori2_slike:hover {
opacity: 1;
filter: alpha(opacity=100);
}

.lijevo_body_sponzor {
padding: 22px;
text-align: center;
margin-left: -236px;
top: 18pc;
width: 200px;
height: 0;
color: #D2D2D2;
font-size: 14px;
position: fixed;
}

.desno_body_sponzor {
padding: 22px;
text-align: center;
margin-left: 59pc;
top: 18pc;
width: 250px;
height: 0px;
color: #D2D2D2;
font-size: 14px;
position: fixed;
}

.sponzori1_slike {
filter: alpha(opacity=60);
opacity: .6;
-webkit-transition: .4s;
-moz-transition: .4s;
-o-transition: .4s;
transition: .4s;
}

.sponzori1_slike:hover {
opacity: 1;
filter: alpha(opacity=100);
}

#boxleft_gogo {
width: 74px;
height: 469px;
left: 0px;
background-color: #070707;
position: fixed;
float: left;
margin-top: 150px;
}
 
.boxleft1_gogo{ width:57px;
 height:143px;
 background-color:#0f0f0f;
 opacity:1.0;
 margin:10px;}
 
.boxleft1_gogo:hover{ background-color:#013e81;}


Announcement:
Code:
<!--

 POČETAK -- Sponzori i partneri / Lijevo i desno u

 -->
<!--

 <div class="lijevo_body_sponzor">
 <a href="//gs

 -->
<div class="desno_body_sponzor">
</div>
 
<!--

 KRAJ -- Sponzori i partneri / Lijevo i desno uz b

 -->
<!--

**************************************************

 -->
<!--

 POČETAK -- Social, lijeva strana -- POČETAK

-->
<div id="boxleft_gogo">
 <a target="_blank" href="//www.facebook.com/esp.hr"> </a>
<div style="" class="boxleft1_gogo">
 <img style="margin-left: 7px; margin-top: 10px; width: 38px; height: 84px;" alt="fb" src="//e-sport.hr/dhr_2/fb_1.png" />
</div><a target="_blank" href="//www.facebook.com/esp.hr"> </a> <a target="_blank" href="//classic.xfire.com/communities/esporthrvatska/"> </a>
<div style="" class="boxleft1_gogo">
 <img style="margin-left: 7px; margin-top: 10px; width: 38px; height: 84px;" alt="xfire" src="//e-sport.hr/dhr_2/xf_1.png" />
</div><a target="_blank" href="//classic.xfire.com/communities/esporthrvatska/"> </a> <a target="_blank" href="//www.youtube.com/"> </a>
<div style="" class="boxleft1_gogo">
 <img style="margin-left: 7px; margin-top: 10px; width: 38px; height: 84px;" alt="youtube" src="//e-sport.hr/dhr_2/yt_1.png" />
</div><a target="_blank" href="//www.youtube.com/gospicteam/"> </a>
</div>

And this is link of my forum : http://www.gospicteam.net/ as u can see it have some bugs because of this code

nojzer
New Member

Posts : 17
Reputation : 1
Language : Croatian

Back to top Go down

Re: Side bar ( Facebook, YouTube etc. )

Post by Pizza Boi on April 18th 2014, 6:47 pm

Hi Very Happy

Can you screenshot? I'm on phone so I can't log in some FM forums easily.

Regards,
Pizza Boi

Pizza Boi
Hyperactive

Male Posts : 2016
Reputation : 160
Language : French
Location : Pizza Hut!

http://redlustempire.forumtl.com/

Back to top Go down

Re: Side bar ( Facebook, YouTube etc. )

Post by nojzer on April 18th 2014, 8:56 pm

No problem bro, here it is Smile :

nojzer
New Member

Posts : 17
Reputation : 1
Language : Croatian

Back to top Go down

Re: Side bar ( Facebook, YouTube etc. )

Post by Pizza Boi on April 18th 2014, 9:24 pm

Hi Very Happy

Okay, thanks. I'm a little confused about it though, how is it buggy?

Regards,
Pizza Boi

Pizza Boi
Hyperactive

Male Posts : 2016
Reputation : 160
Language : French
Location : Pizza Hut!

http://redlustempire.forumtl.com/

Back to top Go down

Re: Side bar ( Facebook, YouTube etc. )

Post by nojzer on April 19th 2014, 1:09 am

well..look at search bar

nojzer
New Member

Posts : 17
Reputation : 1
Language : Croatian

Back to top Go down

Re: Side bar ( Facebook, YouTube etc. )

Post by SLGray on April 19th 2014, 1:50 am

Add this to your CSS:
Code:
input.search {
  margin-top: NEGATIVE NUMBER px;
}
a.button2, button.button2, input.button2 {
    margin-top: NEGATIVE NUMBER px;
}


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


SLGray
Administrator
Administrator

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

http://fmthemes.forumotion.com/

Back to top Go down

Re: Side bar ( Facebook, YouTube etc. )

Post by nojzer on May 1st 2014, 12:03 pm

@J0k3R^ wrote:damn man.. i had a very cool bar but it seems that i deleted the codes from my pc.
anyway, i wrote some fast codes:

CSS:


Code:
#SlideJoker {
  padding-right: 5px;
  right: 0;
  top: 130px;
  position: fixed;
  width: 32px;
}

Homebox (A/P → Display → Homepage)

Code:
<ul id="SlideJoker">
 
<li><a title="Like On Facebook" href="http://www.facebook.com"><img src="http://icons.iconarchive.com/icons/hopstarter/social-networking/32/Facebook-icon.png"></a></li>
 
<li><a title="Follow on Twitter" href="http://www.twitter.com"><img src="http://icons.iconarchive.com/icons/hopstarter/social-networking/32/Twitter-icon.png"></a></li>
 
<li><a title="Subscribe on Youtube" href="http://www.youtube.com"><img src="http://icons.iconarchive.com/icons/graphics-vibe/classic-3d-social/32/youtube-icon.png"></a></li>
</ul>

U can add more buttons, just remember the size should be 32px
I add ur code, and it's fine but i wanna add some hover img and it looks like this:
Code:
<ul id="SlideJoker">
 
<li>
 <a href="https://www.facebook.com/gospicteam"><img href="http://icons.iconarchive.com/icons/danleech/simple/32/facebook-icon.png" onmouseover="this.href='http://icons.iconarchive.com/icons/danleech/simple/64/facebook-icon.png'" onmouseout="this.href='http://icons.iconarchive.com/icons/danleech/simple/32/facebook-icon.png'" /></a>
</li>
 
<li>
 <a href="http://steamcommunity.com/groups/gospicteam"><img href="http://icons.iconarchive.com/icons/dakirby309/windows-8-metro/32/Apps-Steam-alt-Metro-icon.png" onmouseover="this.href='http://icons.iconarchive.com/icons/dakirby309/windows-8-metro/64/Apps-Steam-alt-Metro-icon.png'" onmouseout="this.href='http://icons.iconarchive.com/icons/dakirby309/windows-8-metro/32/Apps-Steam-alt-Metro-icon.png'" /></a>
</li>
 
<li>
 <a href="https://www.youtube.com/user/gospicteamnet"><img href="http://icons.iconarchive.com/icons/danleech/simple/32/youtube-icon.png" onmouseover="this.href='http://icons.iconarchive.com/icons/danleech/simple/64/youtube-icon.png'" onmouseout="this.href='http://icons.iconarchive.com/icons/danleech/simple/32/youtube-icon.png'" /></a>
</li>
</ul>

But it doesn't work, i think it's because of this "this.href" it was "this.src" before but it wasn't work ether... pls help

nojzer
New Member

Posts : 17
Reputation : 1
Language : Croatian

Back to top Go down

Re: Side bar ( Facebook, YouTube etc. )

Post by J0k3R^ on May 1st 2014, 12:09 pm


J0k3R^
Forumember

Male Posts : 742
Reputation : 28
Language : Greek > English > Russian > Spanish
Location : C:\>r00t

http://fmplanet.forumgreek.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