|
HTML - Wordpress Image Disappears When Clicking On Individual Post
Hi, I run an online music website, http://obscurealbums.com
At the end of my last post, I decided to put some buttons with links to Amazon US and UK stores, and everything works fine. However, if you click on the post's title (so clicking on the individual post) the images are replaced by the alt text and the Amazon US is strikethrough. How can I get around this? If you need any more details, please let me know - I'm an HTML novice... Thanks for your time. Similar TutorialsHi. I was trying to post in WordPress a document I made in OpenOffice through it's Word paste function. I tried with MS Word also, but both Open Office Writer and MS Office Word didn't work - just gave me a blank space when I inserted the document. I also tried posting with ScribeFire. I pasted the text, it showed up, but when I posted just blank space. I exported the document to a htm file, but obviously when I just pasted the code of the htm, the images didn't show up, because it was missing the necessary files. As it didn't work (the images didn't show up) hosted both the htm and the files in 000webhost. Everything fine, everything showed up on the website. Time to embed in WordPress. So I googled a bit and found lots os tutorials to do what I wanted, like: http://www.bloggertipsandtricks.com/...rame.html#here http://www.bloggertipandtrick.net/20...ther-site.html But when I click post, it just deletes the code or something, because it shows a blank space again. Yes I'm posting in HTML mode. So... What is wrong with WordPress? I just want to use the iFrame to embed my website, but it doesn't let me! Can you help me please? Thank you. I would like to link an youtube video on one of my blog post using the embedded code that youtube provided. So I added in my post html view this code: <iframe width="640" height="360" src="http://www.youtube.com/embed/mIhqjRWZ77Y" frameborder="0" allowfullscreen></iframe> Before to publish the post I tested it, with the wordpress preview option. Some browser not works well.This is the scenario: 1) Using the last version of the Internet Explorer browser the post with the video works fine. 2) Using the last version of the Google Chrome browser I have to reload the html page two times before to view exactly the embedded video. After that the page works fine but when I load for the first time the page I don't see the video. 3) Using the last version of the Safari and the Firefox browser I have to reload two times the html page before to view the embedded video and after I have a problem viewing the video. The message is that the format video is not supported. Could you please help me to solve the problem. Which is the correct way to use the embedded code starting from youtube website ? How can I debug the issue ? Thanks a lot. Hello everyone, I have an image inside a div, when I try to make the image a clickable hyperlink the image disappears and there is nothing to click or see. Code: <div id="google"> <a href="http://www.google.com/"> <img src="google_icon.png" height="23" width="23" /> </a> </div> I tried an alternative way by making the Div a hyperlink with the following code... Code: <div id="google" class="hand" onclick="location.href='http://www.google.com';" target="_blank"> <img src="google_icon.png" title="google" height="23" width="23" /> </div> This works except for a couple problems...1st when hovering over the link nothing is shown in the browser status bar and 2nd, the target="_blank" isn't working. Here is a link to my site http://chasehearn.com/ On the left hand side there are 6 images (one is not showing) which i would like to make links. I made the first (from the left) one work by making the Div that contains the image a link, but I can't get the link to open in a new window and I don't like how the browser (i'm using chrome) status bar doesn't show anything when hovering over the link. The 2nd icon (which can't be seen) disappears whenever I add <a href></a> tags around it. The images are in the correct folder. Anyone have any ideas on what I'm doing wrong? Thanks! There are 5 copies of the same images are placed in a folder i.e. large(1024*768),medium(500*375),small(240*180),thu mnail(75*75),square(100*50) in size.... The following code upload number of Geocoded images(square size) when the page loads.I want when someone click on the any Geocoded image on the page ,it should show the large image(1024*768) of the same.And further click on the large image it must show again the square size image of the same. Following is the actual code.It is in .js file . var epsg4326 = new OpenLayers.Projection("EPSG:4326"); var OSVMain = (function() { var map, markers, map_move_timeout; var photos = {}; function mapChange() { if( map_move_timeout ) clearTimeout(map_move_timeout); map_move_timeout = setTimeout(mapChangeTimeout, 500); updateLinks(); } function updateLinks() { var center = OSV.getMapCenter(map); var zoom = map.getZoom(); $('#permalink').attr('href',OSV.getURLBase()+'?lat ='+center.lat+'&lon='+center.lon+'&zoom='+zoom); $('#kmllink').attr('href',getLocateLink('kml')); } function getLocateLink(format) { var extent = OSV.getMapExtent(map); var url = OSV.getURLBase()+'/api/photos/locate.'+format+'?bbox='; url += [ extent.left, extent.bottom, extent.right, extent.top].join(','); return url; } function mapChangeTimeout() { map_move_timeout = null; var url = getLocateLink('json'); $.get( url, null, photosLoaded, 'json' ); } function photosLoaded(json) { var new_photos = {}; var size = new OpenLayers.Size(50, 50); var offset = new OpenLayers.Pixel(-25, -25); for( var i = 0, l = json.length; i < l; ++i ) { var p = new OSVPhoto(json[i]); if( photos[p.data.id] ) { new_photos[p.data.id] = photos[p.data.id]; photos[p.data.id] = null; } else { var position = new OpenLayers.LonLat(p.data.lon,p.data.lat); var icon = new OpenLayers.Icon(p.url('square'), size, offset); p.marker = new OpenLayers.Marker(position.clone().transform(epsg4 326, map.getProjectionObject()), icon); new_photos[p.data.id] = p; markers.addMarker(p.marker); } } for( var k in photos ) { var p = photos[k]; if( p && p.marker ) markers.removeMarker(p.marker); } photos = new_photos; } function setup() { var vectors; var popup; map = new OpenLayers.Map($('#map').get(0), { controls: [ new OpenLayers.Control.ArgParser(), new OpenLayers.Control.Attribution(), new OpenLayers.Control.LayerSwitcher(), new OpenLayers.Control.Navigation(), new OpenLayers.Control.PanZoomBar() ], units: "m", maxResolution: 156543.0339, numZoomLevels: 20, displayProjection: new OpenLayers.Projection("EPSG:4326") }); var mapnik = new OpenLayers.Layer.OSM.Mapnik("Mapnik", { displayOutsideMaxExtent: true, wrapDateLine: true }); map.addLayer(mapnik); var osmarender = new OpenLayers.Layer.OSM.Osmarender("Osmarender", { displayOutsideMaxExtent: true, wrapDateLine: true }); map.addLayer(osmarender); var numZoomLevels = Math.max(mapnik.numZoomLevels, osmarender.numZoomLevels); var start = OSV.getStartLocation(); var numzoom = map.getNumZoomLevels(); if (start.zoom >= numzoom) start.zoom = numzoom - 1; map.setCenter(start.pos.clone().transform(epsg4326 , map.getProjectionObject()), start.zoom); OSV.setupMapEventHandlers(map); map.events.register("moveend", map, mapChange); map.events.register("zoomend", map, mapChange); mapChange(); markers = new OpenLayers.Layer.Markers("Markers", { displayInLayerSwitcher: false, numZoomLevels: numZoomLevels, maxExtent: new OpenLayers.Bounds(-20037508,-20037508,20037508,20037508), maxResolution: 156543, units: "m", projection: "EPSG:900913" }); map.addLayer(markers); } return { setup: setup, 1:1 }; })(); $(function(){ OSVMain.setup(); }); Any suggestions ? Thanking you Hello all, I am a beginner and I am trying to create images horizontally that are also links. Hope that makes sense. This is the code that I can get to work but the links stack vertically instead of horizontally. Thanks in advance for all the help! <a href="http://www.speedfactoryracing.net/store"> <img src= "http://www.speedfactoryracing.net/store/images/cart.png" border="0"> <a href="http://www.speedfactoryracing.net/?cat=4"> <img src= "http://www.speedfactoryracing.net/store/images/news.png" border="0"> <a href="http://www.speedfactoryracing.net/?page_id=236"> <img src= "http://www.speedfactoryracing.net/store/images/AIM2.png" border="0"> I've seen it done before.. so it is possible to do. And I need to know basically instead of a topic title with text, you'd have an image. I don't think it was just <a href="img"></a> either because I tried that. And yes, I've searched on Google as well.. anyone have an idea? Also on a side note, are we allowed to have sigs on this forum? Hi, I have created a table in HTML with some basic attributes. However right now I want each cell to have a thin white line around it, but I do not want a table border. Right now I have the border color set to black so that it will not show up on my site. However I do want the TD cells to each have an individual border. Is this possible? Here is my code... My site has a black background by the way. Code: <html>
<body>
<table border="2" bordercolor="black" cellspacing="15">
<tr>
<td bgcolor="black"><a href="http://1lacrosse.com/images/polldaddy/images/magazine/big/1_Big.jpg" onclick="window.open('http://1lacrosse.com/images/polldaddy/images/magazine/big/1_Big.jpg','popup','width=320,height=420,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false"><img border="0" src="http://1lacrosse.com/images/polldaddy/images/magazine/small/1_Small.jpg"></a><br><font color="white"><center><b>#1</b></center></font></td>
<td bgcolor="black"><a href="http://1lacrosse.com/images/polldaddy/images/magazine/big/2_Big.jpg" onclick="window.open('http://1lacrosse.com/images/polldaddy/images/magazine/big/2_Big.jpg','popup','width=360,height=420,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false"><img border="0" src="http://1lacrosse.com/images/polldaddy/images/magazine/small/2_Small.jpg"></a><br><br><font color="white"><center><b>#2</b></center></td>
<td bgcolor="black"><a href="http://1lacrosse.com/images/polldaddy/images/magazine/big/3_Big.jpg" onclick="window.open('http://1lacrosse.com/images/polldaddy/images/magazine/big/3_Big.jpg','popup','width=320,height=420,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false"><img border="0" src="http://1lacrosse.com/images/polldaddy/images/magazine/small/3_Small.jpg"></a><br><font color="white"><center><b>#3</b></center></td>
<td bgcolor="black"><a href="http://1lacrosse.com/images/polldaddy/images/magazine/big/4_Big.jpg" onclick="window.open('http://1lacrosse.com/images/polldaddy/images/magazine/big/4_Big.jpg','popup','width=370,height=480,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false"><img border="0" src="http://1lacrosse.com/images/polldaddy/images/magazine/small/4_Small.jpg"></a><br><font color="white"><center><b>#4</b></center></td>
</tr>
<tr>
<td bgcolor="black"><a href="http://1lacrosse.com/images/polldaddy/images/magazine/big/5_Big.jpg" onclick="window.open('http://1lacrosse.com/images/polldaddy/images/magazine/big/5_Big.jpg','popup','width=390,height=460,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false"><img border="0" src="http://1lacrosse.com/images/polldaddy/images/magazine/small/5_Small.jpg"></a><br><font color="white"><center><b>#5</b></center></td>
<td bgcolor="black"><a href="http://1lacrosse.com/images/polldaddy/images/magazine/big/6_Big.jpg" onclick="window.open('http://1lacrosse.com/images/polldaddy/images/magazine/big/6_Big.jpg','popup','width=350,height=420,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false"><img border="0" src="http://1lacrosse.com/images/polldaddy/images/magazine/small/6_Small.jpg"></a><br><font color="white"><center><b>#6</b></center></td>
<td bgcolor="black"><a href="http://1lacrosse.com/images/polldaddy/images/magazine/big/7_Big.jpg" onclick="window.open('http://1lacrosse.com/images/polldaddy/images/magazine/big/7_Big.jpg','popup','width=360,height=420,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false"><img border="0" src="http://1lacrosse.com/images/polldaddy/images/magazine/small/7_Small.jpg"></a><br><font color="white"><center><b>#7</b></center></td>
<td bgcolor="black"><a href="http://1lacrosse.com/images/polldaddy/images/magazine/big/8_Big.jpg" onclick="window.open('http://1lacrosse.com/images/polldaddy/images/magazine/big/8_Big.jpg','popup','width=360,height=430,scrollbars=no,resizable=no,toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0'); return false"><img border="0" src="http://1lacrosse.com/images/polldaddy/images/magazine/small/8_Small.jpg"></a><br><font color="white"><center><b>#8</b></center></td>
</tr>
</table>
</body>
</html>
By the way I don't want a border around the images because they are different sizes and just wouldn't look that good, instead just with the cells. Thanks so much!! Hello, I am trying to make an html table that looks something like the following: This is the best I can come up with so far: Which was written using the following code: HTML Code: <table border="1" style="empty-cells: hide" FRAME=VOID> <tr> <td> </td> <td> </td> <td> </td> <td> </td> <td colspan="8" ALIGN=center>100614-c5-2_clm3-2x20_*.nrrd</td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> </tr> <tr> <td> </td> <td>3</td> <td>4</td> <td></td> <td>2</td> <td>3</td> <td>6</td> <td>7</td> <td>16</td> <td>11</td> <td>14</td> <td>15</td> <td> </td> <td>3</td> <td>4</td> <td>7</td> <td>8</td> </tr> <tr> <td NOWRAP><h7>100614-c5-2-redo-2x6_*.nrrd</h7></td> <td>2</td> <td>5</td> <td></td> <td>1</td> <td>4</td> <td>5</td> <td>8</td> <td>9</td> <td>12</td> <td>13</td> <td>9</td> <td> </td> <td>2</td> <td>5</td> <td>6</td> <td>9</td> <td NOWRAP><h7>100615-c5-2-clm4-2x15 *.nrrd</h7></td> </tr> <tr> <td></td> <td>1</td> <td>6</td> <td></td> <td>1</td> <td>2</td> <td>3</td> <td>4</td> <td>5</td> <td>6</td> <td>7</td> <td>8</td> <td> </td> <td>1</td> </tr> <td> </td> <td> </td> <td> </td> <td> </td> <td colspan="8">100615-c5-2_redo2-2x6_*.nrrd</td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> <td> </td> </table> I dont care about the individual bevel borders between each cell, those are fine. What Im really trying to do is add an additional black line border to certain "walls" within individual cells, similar to the vertical line that separates the 13 and the 9 in the image above... Any suggestions? (Also, how do I eliminate the borders in the cells that contain the file name?) Thanks ahead of time. Hey everyone! Does anybody know how we could set up google search results for this: ( see pic ) Hi All , In my page, it has two div, one on the left side to do navigation stuff and the right one to display contents of page. How can I create a scroll bar just on the right div so that when it scroll, the div on the left side wont move. REgards Hi all, Sorry if this has been answered already. I've done a search, and couldn't find it. I'm a copywriter who maintains his own HTML website with Notepad. But I'm very ignorant of CSS use. In other words I know enough HTML to get myself into trouble, but nowhere near enough to get myself out! I've just realised that the borders around the images on my portfolio page no longer display. I'm sure they used to. Here's the essence of the code: <img src="images/image.gif" border="1" style="border: gray"> But they work fine when I remove the style tag. But then they appear black, and I want them gray. I'm using some font substitution code (SiFR or something like that). Not sure if that's relevant. I've noticed it's caused some strange problems in the past. Would greatly appreciate it if someone could help. Cheers. In this code I'm using, on the index page is a log-in box. Once a user logs in the log-in box disappears and the container below the log-in box moves up to the log-in box spot. The reason I want to change this is that it leaves a blank space below the moved-up container. Can this code below be changed to, instead of the log-in box disappearing, it is replaced by an equal sized text box, thereby not allowing the below container(news flash) to move up? Any help will be appreciated. Thanks. Code: <!--Begin Right Column-->
<div id="column-right-1">
<!--Begin Login Box-->
<div id="login-box">
<!--[onload_300;block=div;when [var.show_login_box]=1;comm]-->
<form action="login.php" method="post" accept-charset="UTF-8" class="middletext">
<ul>
<li><label><font class="font4_13">[var.lang_user_name]:</font></label><span class="username"><input type="text" name="user_name_login" size="16" style="width:138px;" /></span></li>
<li> </li>
<li><label><font class="font4_13">[var.lang_password]:</font></label><span class="password"><input type="password" name="password_login" size="16" style="width:138px;" /></span></li>
<li> </li>
<li>
<input type="submit" value="[var.lang_login_now]" class="button-form" />
</li>
<li> </li>
<li>
<a href="login.php">[ [var.lang_password_reminder] ]</a> <b>|</b> <a href="[var.register_menu_link]">[ [var.lang_register_today] ]</a>
<input type="hidden" name="submitted" value="yes" />
<input type="hidden" name="remember_me" value="remember_me" />
</li>
</ul>
</form>
</div>
<!--End Login Box-->
<!--Begin News Flash-->
<div class="header-narrow">Welcome</div>
<div class="container-narrow">
This is for your content.Lorem ipsum
adipisicing elit, sed do eiusmod
ut labore et dolore magna aliqua
<ul class="content-list-narrow">
<li><!--[var.newsflash;htmlconv=no;comm]--></li>
</ul>
</div>
<div class="container-narrow-bottom"></div>
<!--End News Flash-->
</div>
<!--End Right Column-->
I can't figure out why when this page is resized in IE7 the text and pictures disappear and all that is left is the background image. There is no problem with FireFox. Any suggestions? http://www.brackinsbaraz.com Hello all mates! I am working with my forum trying to properly edit the html for the posts so that they will display any custom script/html of my choice. I want this to appear in ONLY the first post in every thread. I am also trying to find out how to make a bot that automatically posts another second post in every thread, with my own custom scripts/html. At the moment I am trying to add some adsense ads this way. What I am looking for is two things: 1 - How to get the adsense ad aligned to either right or left of the text within the first post. 2 - How to get an adsense bot autopost an ad as post number 2 in any thread (including being applied to all threads already existing) I am using IPB3. I previously used Adsense Bot for IPB2, and that worked fine, but it is not supported for IPB3. It uses the Universal Mod Installer, and in IPB3 there is a new "hook" feature to ass custom mods etc, but I do not know how to alter the code for the Adsense Bot to work with IPB3 so I am trying to get it done from scratch by adding codes directly into the templates. If anyone know how to configure / modify the old Adsense Bot to work with IPB3 that would be great of course, so I am attaching it here just in case someone wants to take a look at it and its documentation and scripts. But primarily I am looking for the two mentioned features, one is how to get the script running in ONLY the first post of every thread - at the moment I got it running, but it is global and implements into all posts not only the first. I also have figured out how to make a script appear, such as an ad, between posts, but not after ONLY the first post, nor how to make a bot that posts a post just like any member, which is what I am really looking for when it comes to that part. This is the code I have entered into the topicViewTemplate in Topic View: Code: {parse template="aip" group="topic" params="$post"}
<div style="display:block;float:right;margin: 0px 10px 0px 0px;">
<script type="text/javascript"><!--
google_ad_client = "pub-3737464431076938";
/* forum posts large recnt */
google_ad_slot = "6548059149";
google_ad_width = 336;
google_ad_height = 280;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</div>
This works perfectly for adding my desired custom script embedded within the posts. The problem is that it gets embedded in ALL posts and not only the first as I would want. Here is a link to my forum for an example on how it looks: http://www.conspiraciesforums.com/fo...ic/3-atlantis/ I know I have to edit/add some code regarding post counts etc to configure it to only affect the first post - my question is how to do that? And as seen, the second post shows the ad as well, here I would want a bot to post a post containing another ad - between the first and third post of every thread (which will be standard members posts). I have messed my brain with this for more than a week now trying different things, looking around at forums, googling, trying scripts and so on, mods etc, but as of yet have not found the solution to these things for IPB3. Any help here would be extremely greatly appreciated and I'll buy you a beer if you're ever around my part of the world! :p Thanks and bless you! -M There has to be like a 1-line-of-code process for this...anyone know how to do it? Hi: I have a link that I want to send out to my users on a Page, (this link is about 240 characters long: http://xxxxxxxxxxxxxxxxx, etc, etc) I wish my page to automatically bring up the link on the User's screen. How do I do this please ?? (btw, now I just show a 'clickable' link on the page and the user must 'click' it to activate the link. But, I wish to automate this action please) Thanks ! -Mel Smith Hey guys, Just a quick and hopefully simple question. I'm trying to check the accuracy of my hits and visits system on my website, so I wanted to get a bot which clicks on a link from the same IP every few days, hours, minutes or seconds. Basically I want a bot that clicks on a link at every specified interval, just like a real person would click on a link. However, I obviously don't want the resulting window to come up, I just want the server to think I've clicked. Are there programs that already do this? Hello, I'm working on a video website for someone and they want to add a pop-up that opens up when a user clicks the play button on the video. The video will play and the pop-up will load. Is there a technical term for this? What's the easiest way to do it? Any documentation anywhere? I couldn't find much on this, probably because I'm not using the right term to find it.. Anyway, any help would be appreciated. Thanks! Hello, I was wondering if there was away to remove a DIV that I have when a link is clicked? Also I have a drop down list and I would also like the div to go away when one of those are selected. Thank you so much in advance, I really appreciate it! hmm is there a way to do this so i have a text link <input type=button onClick="show()" value="hide"> when the user clicks on the button it calls some javascript which shows a div (not relevant!!). is there a way so that you click on the same button again it calls some different javascript e.g. hide() ?? I know about onFocus, onBlur etc but this is not what i need. |
|||||||