go41

custom email submit and social networking links buttons

von Joern am 15. Dez. 2009 | Keine Kommentare

To design an email submit form and four social networking buttons beside this form it’s best to use one DIV with two inner DIVs. These are styled with your stylesheet to look as wanted.
The sample I give here works as replacement for the add space in the header of the WordPress Theme Arthemia.
The first thing to do: Add the following lines to your style.css (just at the end)
Code:

/* header right Elements */
#bookmarks{width:400px; height:80px;}
.bttns{width:90px; height:80px;}
.sbmtfield{width:250px; height:70px;padding-left:10px;margin-top:5px;border: 1px solid #ddd;}
.sbmtfield p {font-size: 1.1em;margin:5px 0;}
input.e_box {width:180px;}
input.red {background-color:#cc0000; font-weight:bold; font-size:12px; color:white;width: 60px;}

Now open up your header.php and replace the whole thing:

Code:

<div class="right">
   <img src="<?php echo get_option('home') OR WHATEVER YOU HAVE HERE
   </div>

The edited header.php should have before that:

Code:

<div id="tagline"><?php bloginfo('description'); ?></div>
   </div>
LEAVE ABOVE AS IS AND INSERT NOW:
<!-- new stuff -->
<div id="bookmarks" class="clearfloat right">

<div class="sbmtfield left">
<p>For exclusive.. bla bla ... write what you like here</p>
<form action="http://visitor.constantcontact.com/d.jsp" target="_blank">
<input class="e_box" name="Email" value="put your Email address here" type="text"/>
<input class="red" value="Do It!" name="sub" type="submit"/>
<input type="hidden" name="m" value="PUT YOUR ID BACK HERE">
<input type="hidden" name="p" value="oi">

</form>
</div>

<div class="bttns right">

<a href="https://twitter.com/be ..... USE YOUR STUFF

<a href="http://www.be ..... USE YOUR STUFF

<a href="http://www.facebook.com/home.php#/pages/wwwbe.... USE YOUR STUFF

<a href="http://www.foursquare.com/user/...... USE YOUR STUFF
</div>
</div>
<!-- new stuff end -->
NOW SHOULD BE BELOW THIS IN YOUR HEADER:PHP:
</div>

<div id="navbar" class="clearfloat">

Be sure to add your original submit ID for the email submit and also just your complete four lines for facebook et!
You might have to adjust some css values, I guess it should be ok already.
____________________
you find me on Google+, Twitter and Facebook

(von: master)

Hier noch 1 weitere Ergebnisse dieses Threads:

Masteradmin, have a „Non-technical“ question for you. Thanks

21. Mai. 2012 (von: omerkhan01)

Masteradmin, I was just wondering what are some good sites, that I can post my Wordpress development services to get "gigs"> I have been using Craigslist to post my development services in the "Services" section and I am also on…

Autor:

Du findest mich auch auf Google+, Twitter und Facebook!

Schreibe einen Kommentar

Pflichtfelder sind mit * markiert.


weitere forum Beiträge: