HTML - Problem With Social Networking Share Code
I am new to web building and almost done with my first website. There are 2 problems I am having and if they were to be solved I could finish completely. Any help on these two issues would be greatly appreciated.
The url the everything is hosted at is hillsidemedicalbilling.com/ if you visit it you will notice what I am referring to. I am trying to place share buttons for some of the social networking sites on the page using custom icons. After 4 days of reading everything I can find on them I have gotten pretty close. It seems the Twitter button is the only one that is actually working, and even then, the title does not post with the link. All of the other ones bring up a page for the right website but it says "this page no longer exists." The second problem I am having is, the google + button will not align correctly (I want it to be centered with what is directly above it), I had the same problem with the facebook "like" button, but was eventually able to fix it by adding padding-left: 48px; to the CSS. After trying this with the google+ buttons, it does not respond. You will see what I have tried as I have left it on the CSS (but deleted padding-left: 58px; that I attempted unsuccessfully). All of the social networking buttons are within <div h2 name="logo"...name="social" Here is the markup I have figured out thus far: HTML Code: <div id="logo"> <h2 class="social"> <a target="_blank" rel="external" href="http://reddit.com/submit=http://hillsidemedicalbilling.com/&title=Hillside Medical Billing"> <img src="images/reddit_wood.JPG" title="Reddit"/></a> <a target="_blank" rel="external" href="http://twitter.com/home?status=http://hillsidemedicalbilling.com/&title=Hillside Medical Billing"> <img src="images/twitter_wood.JPG" title="Twitter"/></a> <a target="_blank" rel="external" href="http://www.linkedin.com/shareArticle?mini=http://hillsidemedicalbilling.com/&title=Hillside Medical Billing"> <img src="images/linkedin_wood.JPG" title="LinkedIn"/><br /></a> <a target="_blank" rel="external" href="http://digg.com/submit?phase=http://hillsidemedicalbilling.com/&title=Hillside Medical Billing"> <img src="images/digg_wood.JPG" title="Digg"/></a> <img target="_blank" rel="external" src="images/rss_wood.JPG" title="RSS" alt=""/> <a target="_blank" rel="external" href="http://www.stumbleupon.com/submit?url=http://hillsidemedicalbilling.com/&title=Hillside Medical Billing"> <img src="images/stumbleupon_wood.JPG" title="StumbleUpon"/></a><br /> <div class="fb-like" data-href="http://hillsidemedicalbilling.com/" data-send="true" data-layout="button_count" data-show-faces="true" data-font="arial"></div> <br /> <div class="g-plusone" data-size="small" data-href="http://hillsidemedicalbilling.com/"></div> </h2> <h2 class="member"><a target="_blank" rel="external" href="http://www.nebazone.com/exam.html/"><img src="images/NEBA.JPG" /></a></h2> <h1 class="logo">Welcome To<br /><a href="http://hillsidemedicalbilling.com/"> <img src="images/HMBLogoMed.jpg" /></a></h1> </div> Similar TutorialsFirst off I am a novice with limited knowledge of code and building sites. I have used different programs over the past couple years in school but web design was not my focus or major. It just so happens I am starting a new venture and it is going to require a website to be fully operational. So here is my issue (one of many), I have a header I built for this website I am building. I build this header in photoshop 1000px x 200px. It contains my logo and some design. It is static. But in the bottom right hand of this header I want to add the social networking buttons. I have a spry widget set up for it (Jsocial Widget to be specific) but I can't get it to lay on top of the header. What is the other way I can accomplish this task... Facebook, Twitter, Youtube and I want an RSS link but I am not that far along yet so it would be something I would add later in the same location. Thanks in advance! Hey guys, I have this pretty big idea on making a social networking site. I would greatly appreciate it if you could help me with any ideas, or anything that would make this look any better. Also maybe some ideas on how it would look for a home page, and profile page. The signup page is http://azureonline.netau.net/pages/signup.php . Thank you! Hi, Basically, I am giving away a flash game so under the actual game I have a box with html flash embed so they can add it their site etc. However I also want the html they add to have a share box, so when the game is on their site there is another share box with the html. So basically the share code, has to have the code for the game and the share code. The thing is I can't add the code to the box becuase either i'm an idiot, or its impossible. <!--flash game--> <script type="text/javascript"> /*<!--*/ var so = new SWFObject("http://www.magneticdigital.co.uk/flash/solar-uprising.swf", "flashCaptPicard", 550, 400, "7"); so.write("flashCaptPicard"); /*-->*/ </script> <!--flash game end--> <!--share box--> <div style="overflow:auto; height:100px; width:440px"> <table cellpadding="0" cellspacing="0" style="width:415px;"> <tr> <td> <!--flash game--> <script type="text/javascript"> /*<!--*/ var so = new SWFObject("http://www.magneticdigital.co.uk/flash/solar-uprising.swf", "flashCaptPicard", 550, 400, "7"); so.write("flashCaptPicard"); /*-->*/ </script> <!--flash game end--> PROBLEM: share box should go here as well, but I can't add it with out adding the share code, which in turn requires yet another version of the game code. And on and on and on. </td> </tr> </table> </div> Is this even posssible, been trying to figure it out for ages. Thanks So anyway, my boss wants them, I have no idea what they are, nor does he, because they don't seem to do anything nor do I really want to know. The code for them is fairly simple, my problem is I make 5-20 new pages per day just working on a file system and one more thing that has to be done for every page is yet more room for error and more wasted time. Is there any code in php or html that will plunk the url of the current page into the social bookmark code so I don't have to goto each one 5-20 times a day and copy and paste it in there? I think things will get a lot easier once I get my copy of dreamweaver but I would like to do this now if it is possible. Thanks... Codeguru PS- Or javascript code, just anything that might accomplish it. Hey board members - I've just coded a blog for my daughter and need to know how to make it interactive. She wants to be able to "share" on twitter and facebook etc; she wants readers to "subscribe" and to have a newsletter mailing list. I understand html and CSS but am out of my depth when it comes to this newer stuff - is the correct term, server side extensions? Direction as to where to post this type of question would be appreciated. Cheers, Mal When I share my index.html via facebook, I have some stuff into boxes like a descriptions of something, where I can change description? If any1 understand me? I want to edit and add my text by default... Sorry for maybe bad english ;/ How do I get these to show up side by side rather than on top of eachother with space in between them. for an example of what it looks like now go to www.ecxgaming.com/genericnews.html and check out the facebook like button, twitter, and google plus button. Here is the code: HTML Code: <div id="fb-root"></div> <script>(function(d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) {return;} js = d.createElement(s); js.id = id; js.src = "//connect.facebook.net/en_US/all.js#xfbml=1"; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk'));</script> <div class="fb-like" data-send="false" data-width="450" data-show-faces="true"></div> <a href="https://twitter.com/share" class="twitter-share-button" data-count="horizontal" data-via="ecxgaming">Tweet</a><script type="text/javascript" src="//platform.twitter.com/widgets.js"></script> <g:plusone size="small" annotation="inline"></g:plusone> <!-- Place this render call where appropriate --> <script type="text/javascript"> (function() { var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true; po.src = 'https://apis.google.com/js/plusone.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s); })(); </script> <!--End google like button--> Thanks in advance I need help from people about making my site. i need login forms, chatting, mail, stuff like that. please post comments if you wish to help. The title sums it up pretty much! I have two DIVs, one on the left the other on the right as follows: css: Code: DIV { bottom: 0px; overflow: auto } #main { position: fixed; top: 160px; right: 30px; left: 270px; opacity: 0.9 } #lhs { position: fixed; top: 160px; left: 30px; width: 210px; opacity: 0.9 } html: Code: Some titles and stuff.... <DIV id=lhs>menu stuff..</DIV> <DIV id=main>content...</DIV> This works fine but the two scrollbars are ugly and obstruct parts of the site. I would Ideally like one scroll bar to move the entire page or, if not, at least the two DIVs. Would that be possible? Any help would be much appreciated. Hi All, I am new to html programming. I am having problem in sharing a variable between 3 html pages. I tried googling for the solution but couldn't get the right one. A brief about my problem is... 1. I have 3 html pages, 1.htm, 2.htm & 3.htm 2. I have a variable var1 in 1.htm which is set to 0. 3. 1.htm will open 2.htm and 3.htm 4. 3.htm will update the var1 variable declared in 1.htm to 1 on onunload event. 5. 2.htm will check the status of var1 for value 1, if yes it will navigate to next page. I have pasted the code below for 1.htm, 2.htm & 3.htm respectively. Can anyone please help me in this regard. Thanks in advance. Regards, tux09. ---------------------------------------------------------------- 1.htm -------- <html> <head> <title>main</title> <script type="text/javascript"> var checkPopUpClosed = 0; function delayed_redirect(){ window.open('3.htm','SaveAs','height=250,width=640,resizable=0,directions=0,location=0,toolbar=0,men ubar=0,scrollbars=0'); } </script> </head> <body ><!-- masthead --> <table border="0" cellpadding="0" cellspacing="0" summary="."> <tr><td ><h1>Main</h1></td></tr> </table> <FORM method="post" name="mainForm" ACTION="2.htm"> <table cellspacing="0" cellpadding="0" border="0" summary="." > <tr> <td class="rightContentPane"> <br><br> <div class="pad10"> <div> <INPUT type="submit" name="Back" accesskey="b" alt="Back" VALUE="< Back"> <INPUT type="submit" name="Finish" accesskey="s" alt="Save As" onclick="javascript:delayed_redirect();" VALUE="Save As"> <INPUT type="submit" name="Cancel" accesskey="c" alt="Cancel" VALUE="Cancel"> </div> </td> </tr> </table> <div> <INPUT type="hidden" name="Hide" VALUE="18489"> <INPUT type="hidden" name="shVariable" VALUE="0"> </div> </FORM> </div> </body> </html> ---------------------------------------------------------------------------------------- 2.htm -------- <html> <head> <title>second</title> <meta http-equiv="refresh" content="5;" /> <script type="text/javascript"> //if (1 == document.mainForm.checkPopUpClosed.value) var temp = 0; if (1 == top.mainForm.checkPopUpClosed) alert("Close received = ");//+document.mainForm.checkPopUpClosed.value); function checkClick() { //temp = top.parent.item.forms("mainForm","checkPopUpClosed"); //temp = parseInt(parent.checkPopUpClosed);//.document.frames.item("shVariable"); //temp = document.getElementById("mainForm"); //temp.parentElement(shVariable); //temp = document.mainForm.checkPopUpClosed.value; alert("temp = "+temp); } </script> </head> <body onclick="checkClick();"><!-- masthead --> <tr><td ><h1>Second</h1></td></tr> <FORM method="post" name="secondForm" > <table cellspacing="0" cellpadding="0" border="0" summary="." > <tr> <td > <div > <table width="200" border="3" cellspacing="0" cellpadding="0" summary="."> <tr> <td style="text-align:center;"> <br/> <h3>Result</h3> <br/> In progress. <br/><br/><br/> </td> </tr> </table> </div> </td> </tr> </table> </FORM> </div> </body> </html> ------------------------------------------------------------------------------- 3.htm -------- <html> <head> <title>third</title> <script type="text/javascript"> function doClose(){ if (window.opener && !window.opener.closed) { window.opener.location.href="1.htm"; } } function delayed_close() { setTimeout("window.close();",7000); } function delayed_Openclose() { delayed_close(); setTimeout ("doClose();", 6900); } function doAbnormal_Close() { var temp2 = 0;// = document.getElementById("mainForm"); top.mainForm.checkPopUpClosed = 1; temp2 = top.mainForm.checkPopUpClosed; //temp2 = open.document.forms("mainForm", "0").checkPopUpClosed = 1; //temp2 = document.getElementById("mainForm").checkPopUpClosed.value; alert("temp2 = "+temp2); //alert("checkPopUpClosed 1 = "+top.mainForm.checkPopUpClosed); //document.mainForm.checkPopUpClosed.value = true; //alert("checkPopUpClosed 2 = "+document.mainForm.checkPopUpClosed); } function checkClick() { var temp3 = 0; //temp3 = if(window.opener.closed); alert("temp3 = "+temp3); } </script> </head> <body onunload="doAbnormal_Close();" onclick="checkClick();"> <FORM method="post" name="thirdForm" ACTION="2.htm"> <table cellspacing="0" cellpadding="0" summary="."> <tr> <td style="text-align:center;"> <br /><br /> <h3>Checking</h3> <br /><br /> To submit this request click "Save As" <br /><br /> <INPUT type="submit" name="Save" accesskey="s" alt="ok" onclick="javascript:delayed_close();" VALUE="Save As"> <br /><br /> </td> </tr> </table> </FORM> <script type="text/javascript"> </script> </body> </html> --------------------------------------------------------------------------------------------- Hi board members I've been hard at this for hours and can't get it working. Following the tutorial on facebook in order to specify the image which is associated with the page in question, my daughter's blog which I coded in notepad Please be advised the facebook links are not positioned where they will finally reside on the page. I have tried the iframe method first which doesn't have image control of this, then tried html5; and then the supa dupa xfbml methods. The latter two are called open graph. However ALL three methods return the rss icon image - so frustrating. The image I want to use is within their parameters and is in my images folder on level above the root. Can you please look at my code and shed some light on this. Note all of this code has been generated by their engine - copy/paste. the lines you are interested in are 11-16; 24-31 and 62 Good luck, Mal from Cessnock im busy creating a code for a page on a website but i cant get the column's to align properly also i can't find a way to get my links in the column ( the text continious but the columns end so does the text), also i want to get the links to appear yellow (i can't find a code for that either xs ) can some one help me or shuv me in the right direction , in addition heres the code so you can watch it and tell me what to adjust regards, Mr momo code: <body bgcolor="#40FF00"> <font color="#808080"> <br /> <html> <body> <div id="container" style="width:500px"> <div id="header" style="background-color:#40FF00;"> <h1 style="margin-bottom:0;">H@cker's den of</h1></div> <div id="menu" style="background-color:#800080;height:800px;width:100px;float:left;"> <b><a href="http://www.hellboundhackers.org/index.php">HellboundH@cker's</a></b><br /> HTML<br /> CSS<br /> JavaScript</div> <div id="content" style="background-color:#40FF00;height:250px;width:400px;float:left;"> <center> <pre> ooo. .oo. .oo. oooo d8b `888P"Y88bP"Y88b `888""8P 888 888 888 888 888 888 888 888 .o. o888o o888o o888o d888b Y8P ooo. .oo. .oo. .ooooo. ooo. .oo. .oo. .ooooo. '888P"Y88bP"Y88b d88' `88b `888P"Y88bP"Y88b d88' `88b 888 888 888 888 888 888 888 888 888 888 888 888 888 888 888 888 888 888 888 888 o888o o888o o888o `Y8bod8P' o888o o888o o888o `Y8bod8P' </pre> -------------------------------------------------------- </font> <marquee behavior="slide" direction="right" loop="3" slideamount="999" stop="center" ><h1>On the run</h1></marquee> <marquee behaviour="scroll" direction="down">0110100101100 1100010000001 1110010110111 1011101010010 0000011101110 1100001011011 1001110100001 0000001110100 0110111100100 0000111001001 1001010110000 1011000110110 1000001000000 1101101011001 0100100000011 0011001101001 0110111001100 1000010000001 1011010110010 1001000000110 1111011011100 0100000011010 0001100101011 0110001101100 0110001001101 1110111010101 1011100110010 0011010000110 0001011000110 1101011011001 0101110010011 1001100101110 0110001101101 1110110110100 1000000110100 1011011100010 0000011101000 1101000011001 0100100000011 1001101100001 0110110101100 1010010000001 1000010110110 0011011000110 1001011000010 1110011001000 0001100001011 1001100100000 0110110101111 0010010000001 1100110110100 1011101000110 0101001001110 1110011001000 0001101011011 0010101100101 0111000000100 0000111100101 1011110111010 1011100100010 0000011010000 1100101011000 0101100100011 1001100100000 0110010001101 1110111011101 1011100010000 0011000010110 1110011001000 0100000011110 0101101111011 1010101110010 0010000001100 0110110100001 1010010110111 0001000000111 010101110000. <center> From the law!!!!!</center></marquee> ---------------------------------------------------------- <table border="1" bordercolor="0000000" style="background-color:#40FF00" width="10" cellpadding="" cellspacing=""> <tr> <td>S</td> <td>A</td> <td>T</td> <td>O</td> <td>R</td> </tr> <tr> <td>A</td> <td>R</td> <td>E</td> <td>P</td> <td>O</td> </tr> <tr> <td>T</td> <td>E</td> <td>R</td> <td>E</td> <td>T</td> </tr> <tr> <td>O</td> <td>P</td> <td>E</td> <td>R</td> <td>A</td> </tr> <tr> <td>R</td> <td>O</td> <td>T</td> <td>A</td> <td>S</td> </tr> </table> <p style="font-family:verdana,arial,sans-serif;font-size:10px;"> Leave your username , if intrested in co-op with me on some project's <form name="input" action="SubmittedUsername's.asp" method="get"> Username: <input type="text" name="user" /> <input type="submit" value="Submit" /> </form> </center></div> <div id="footer" style="background-color:#C0C0C0;clear:both;text-align:center;"> @hellboundhackers.org</div> </div> I am trying to get this page: http://www.stevemedleyphotography.com/bwg/index.html working in both IE and Firefox. After many trials and errors I found the problem to be the W3C DTD Code. Now as an example I'll show you this: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> I say example because I have tried every possible DTD code from http://www.w3.org/QA/2002/04/valid-dtd-list.html and always get the same result. The result is if I put it in like above then the site works in IE 7. But in Firefox (At least on my Mac, can't get Firefox to download on the PC oddly), the webpage loads with the flash getting pushed up really high and into the header, also the entire flash part is significantly smaller. In order to get it working properly in Firefox I have to have the code like this: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> Notice the lack of the final link. This then works in FireFox but in IE it ONLY shows my header and a blank page, no part of the flash loads, or if it is loading then it's so far off screen that I can't see it. Any suggestions? HI I have try this code in the ie , it was working good but i try ir in the opera/firefox and both of them was not get the effects . how can solve it ? code: <table border='0' ' bordercolor='#FFFFFF' style='border:dotted;border:1px;;border-color:#FF0000> TNX A site I work for is using a habbo fansite forum. There using a rare values system by Bobboid. (Project Rare Value) But the page that the forum users are meant to see (with the values on) is completely blank. The system has a CP. Ive been given admin so i can fix it. But the source code is giving me no clues as to whats wrong! Heres the code for the CP. (when you add a value) Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Bobboid Rare Values</title> <link rel="stylesheet" HREF="style.css" TYPE="text/css" media="screen"></head> <body> <div id="main"> <p><img src="banner.png" width="500" height="175" /></p> <div id="navigator"> <p><strong>Navigator</strong></p> <p><br /> <a href="admin_home.php">Home</a><br /> <a href="admin_password.php">Change Password</a><br /> <a href="admin_logout.php">Logout</a><br /> <a href="admin_editrarevalues.php"><br /> Edit Rare Values</a><br /> <a href="admin_editseasonalvalues.php">Edit Seasonal Values</a><br /> <a href="admin_editsupervalues.php">Edit Super Rare Values</a><br /> <a href="admin_editbankvalues.php">Edit Bank Item Values</a> </a><br /> <a href="admin_editseasonalvalues.php">Edit Other Rare Values</a><br /> <br /> <br /> <a href="admin_addrare.php">Add Rare</a><br /> <a href="admin_editrare.php">Edit/Delete Rare</a><br /> <a href="admin_viewhistory.php">View History </a><br /> <br /> <br /> <br /> <a href="admin_adduser.php">Add User</a><br /> <a href="admin_removeuser.php">Remove User</a><br /> <a href="admin_edituser.php">Edit User</a><br /> <br /> <br /> <br /></p> <p> </p> </div> <div id="content"> <p><strong>Add a Rare </strong></p> <form id="form1" name="form1" method="post" action=""> <label><em><strong>Details</strong></em><br /> <br /> Rare Name <input name="name" type="text" id="name" /> </label> <br /> <label>Rare Type <select name="type" id="type"> <option value="rare">Rare</option> <option value="seasonal">Seasonal</option> <option value="super">Super Rare</option> <option value="bank">Bank</option> <option value="other">Other</option> </select> And heres the code for the page that the forum users are meant to see the values and that on: PHP Code: Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML><HEAD> <META http-equiv=Content-Type content="text/html; charset=iso-8859-1"></HEAD> <BODY></BODY> <META content=ORTNQESHAF name=SKYPE_FRAMEID></HTML> Are there any clues as to how i can rebuild the code for that page? Because someone has deleted it! Please help il find some way to thank you! hi, problem with my code. it does not post to the save.php, the only thing that gets posted to the php file is a ":" can someone help Code: <form method="POST" action="save.php"> <div align="center"> Username: <input type="text" name="username" size="15" /><br /> <div align="center"> Gender: <input type="gender" name="gender" size="15" /><br /> <div align="center"> E-mail: <input type="email" name="email" size="15" /><br /> <div align="center"> <p><input type="submit" value="Sign Up" /></p> </div> </form> Hi, Been having a few problems with my code and need to seek help! I have pasted the code below of what i currently have, which works but the code it's self is invaild and will not pass xhtml checker. This is because i have the link arround other tags so the idea is when you hover over it the background image will change. If i put the link on its own in front of the code it will then just show the hover backgrounds but the text will be pushed below. I cant see how you get around this issue and help or pointers would be great! Thanks This is what i have: Code: div class ="features"> <a href="design.htm"> <h2>Starter</h2> <ul> <li>item 1</li> <li>item 2</li> <li>item 3</li> <li>item 4</li> </ul> <div class="more">More</div></a> </div> The Css: Code: .features { display:block; width: 202px; height: 202px; float:left; margin-left: 25px; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; margin-top: 25px; color: #0066FF; } .features a{ display: block; height: 202px; width: 202px; background: url(images/button.gif) top left; background-repeat: no-repeat; } .features a:hover { background-position: bottom left; display:block; width: 202px; height: 202px; background-repeat: no-repeat; } |