I am designing a site with wordpress. My index page keeps posting news items side by side, and nomatter how I try to modify my code, it will not place a break between the two.
To see what I mean, visit www.acacians.net.
Here is the chunk of code in my template that controls the "News Post" portion of the page:
<table width="760" border="0" align="center" cellpadding="10" cellspacing="0" background="wp-content/themes/DarlingTemplate/images/tablebg.jpg">
<tr>
<td>
<table width="530" border="0" align="left" cellpadding="10" cellspacing="0" bgcolor="#f4f3f0">
<tr><?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<td><table width="530" border="0" cellspacing="0" cellpadding="5">
<tr>
<td width="30" height="30"><img src="wp-content/themes/DarlingTemplate/images/category.jpg" /></td>
<td background="wp-content/themes/DarlingTemplate/images/subjbg.jpg"><strong><?php the_title(); ?></strong><br />
Posted on <?php the_time('F jS, Y') ?>
</td>
</tr>
</table>
<table width="530" border="0" cellspacing="0" cellpadding="5">
<tr>
<td width="5"></td>
<td width="505"><?php the_content(__('(more...)')); ?>
</tr>
</table>
<?php endwhile; else: ?>
<p><?php _e('Sorry, no posts matched your criteria.'); ?><p>
<?php endif; ?>
</td>
</td>
</tr>
</table>
I have tried inserting a break at the end of every line, and then refreshing my page. Why isn't this working?
I appreciate any help that can be offered.
Thank you so much!!!!
it's because you are printing all of the posts into the same tag.
A larger problem though is that you are using nested tables in your layout.
Related
<div class="table-responsive">
<table class="table table-striped">
<thead>
<tr>
<th>Agent Name</th>
<th>Total number calls audited</th>
<th>Fatal Count</th>
<th>Score</th>
<th>Average</th>
</tr>
</thead>
<!-- <div style="overflow:scroll;min-height:.01%;overflow-y:hidden;overflow-x:scroll;"> -->
<tbody>
<?php
$totalauditded=0;
$totalfatal=0;
$listau=$aucnt->result();
$totalauditded+=$rpostclist->audited;
$totalfatal+=$rpostclist->cnfatal;
?>
<tr>
<td><?php echo $rpostclist->agent_name;?></td>
<td><?php echo $rpostclist->audited;?></td>
<td><?php echo $rpostclist->cnfatal;?></td>
<td>
<table class="table table-bordered">
<tr>
<?php $i=1; foreach($listau as $raucnt) { ?>
<th> Call <?php echo $i;?><br/><?php echo $raucnt->qa_agent;?><br/><?php echo $raucnt->qa_date; ?><br>View</th>
<?php $i++;} ?>
</tr>
<tr>
<?php $sum = 0; foreach($listau as $raucnt) { ?>
<td><?php echo $raucnt->tot;
$sum += $raucnt->tot;?>%</td>
<?php } ?>
</tr>
</table>
</td>
<td style="vertical-align:middle;font-weight:bold;font-size:20px;"><?php echo round($average=$sum/count($listau));?>%</td>
</tr>
<?php } ?>
<tr>
<td></td>
<td style="font-size:16px;"><strong>Total:<?php echo $totalauditded;?></strong></td>
<td style="font-size:16px;"><strong>Total:<?php echo $totalfatal;?></strong></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
I googled but didn't find any solutions. What i'am trying is to keep a horizontal bar at the top of the table since it fetches many data from the database its hard to scroll. Maybe both top and bottom horizontal scroll bar is also good for the suggestions.
I changed my container axis to 180 Degree
<div class=" table-responsive"style="transform: rotateX(180deg);">
<table class="table table-striped" style="transform: rotateX(180deg);">```
Use css
overflow-x : auto;
Reference
https://www.w3schools.com/howto/howto_css_menu_horizontal_scroll.asp
<div class="table-responsive">
change to
<div class="table-responsive" style="overflow-y: scroll; overflow-x: auto">
I have a page that displays information from a db in a while loop. Using Bootstrap table and a var $loopcounter that gives each line a separate id. When cliking on a line I am able to expand on the information for each row. This works perfect, thanks to SO and Google.
My problem now is that the table is displaying a double line for the hidden/collapsed row. I have tried several solutions like padding:0 !important, border-color: #FFF, border-color: none, nothing seems to work. Also tried colspan, but that only expands the double line further.
HTML:
<table class="table table-striped table-hover">
<thead>
<th>Name</th>
<th>Age</th>
<th>Adr</th>
</thead>
<tbody>
<?php while ($row = $variable->fetch()) { $loopcounter++ ;?>
<tr data-toggle="collapse" data-target="#row<?php echo $loopcounter; ?>" class="accordion-toggle">
<td><?php echo $row['name']; ?></td>
<td><?php echo $row['age']; ?></td>
<td><?php echo $row['adr']; ?></td>
</tr>
<tr>
<td class="hiddenRow"><div class="accordian-body collapse" id="row<?php echo $loopcounter; ?>">
<table>
<thead><tr><td>Some Header</td></tr></thead>
<tbody><tr><td><?php echo $row['name']; ?></td></tr></tbody>
</table>
</div>
</td>
</tr>
<?php } ?>
</tbody>
</table>
CSS:
.hiddenRow {
padding: 0 !important;
border-color: FFF;
}
IMAGE:
Notice the double border when row is collapsed
It had actually a pretty easy solution, just styled the hidden TD with border:none
I'm designing a email template and test it on various clients including gmail.
Gmail just won't display the images though. Don't tell me gmail doesn't support it cause I'm getting images all the time.
The logo is of course in the html code, not css.
Here's my code for the header-table:
<table align="center" border="1" cellpadding="0" cellspacing="0" style="border-collapse: collapse; line-height: 1.5em;">
<tr>
<td>
<p>
<img style="display: block; margin: auto;" align="center" alt="Example logo" src="http://example.com/media/images/email/example-logo.png"/>
</p>
</td>
</tr>
</table>
Any suggestions?
you have mistake
alt="Example" logo"
This html must work
<table width="100%" cellspacing="0" cellpadding="0" border="0" bgcolor="#fefefe">
<tr>
<td align="center">
<table width="700" cellpadding="0" cellspacing="0" border="0" style="border-collapse: collapse;">
<!--header starts-->
<tr>
<td align="center" width="100%"><img src="http://siteurl.com/logo_beta.png" alt="Company Logo" /></td>
</tr>
<tr>
<td align="left">
<p><strong><font size="2.5" face="Times New Roman, Arial, Helvetica, sans-serif">Hi User!</font></strong>
</p>
</td>
</tr>
<tr><td><span><br></span></td></tr>
<!--header ends-->
<!--content starts-->
<tr>
<td colspan="3" align="center">
<table width="700" cellpadding="0" cellspacing="0" border="0" style="border-collapse: collapse;">
<!--Table Content-->
</table>
</td>
</tr>
<!--content ends-->
<!--fotter starts -->
<tr>
<td align ="left">
<p><strong><font size="2.5" face="Times New Roman, Arial, Helvetica, sans-serif">Thanks<br>
With best wishes, Company</font></strong>
</p>
</td>
</tr>
</table>
</td>
</tr>
</table>
Gmail automatically shows you the images in your messages. If you have a slow Internet connection or limited mobile data, you may want to change your setting so that Gmail asks you before showing images.
Note: This is the reason we shouldn't depend on images. Better way is
to use the style alt text so if images is blocked by email provider due to low internet connection or due to security issue a mail still
should work.
Gmail scans every message for suspicious content and if Gmail considers a sender or message potentially suspicious, images won’t be displayed and you’ll be asked whether you want to see the images.
Actual content is from gmail support.
I'm using MailChimp to create a RSS-to-Email campaign based on a WordPress feed.
However, the FEEDITEM:IMAGE tag doesn't grab the featured image from my posts...
I've tried several solutions including dedicated plugins (like this one: https://wordpress.org/plugins/featured-images-for-rss-feeds/) and customized feed-rss2.php (as explained here: https://stackoverflow.com/questions/ask?title=mailchimp%20featured%20image).
Here is my HTML:
<table mc:repeatable="layout" mc:variant="1/1 Panel" bgcolor="#f6f6f6" align="center" width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td align="center">
<table class="table600" bgcolor="#FFFFFF" width="600" border="0" align="center" cellpadding="0" cellspacing="0" style="margin-left:20px; margin-right:20px;">
<tr>
<td height="50"></td>
</tr>
<tr>
<td align="center">
<table align="center" class="table-inner" width="550" border="0" cellspacing="0" cellpadding="0">
*|FEEDBLOCK:http://louerunmanager.com/feed/|*
*|FEEDITEMS:[$count=1]|*
<!-- img -->
<tr>
<td align="center" style="display:block; line-height:0px; font-size:0px; border:0px;" class="img1" alt="img" width="550" height="190">
<img src="*|FEEDITEM:IMAGE|*">
</td>
</tr>
<!-- end img -->
<tr>
<td height="25"></td>
</tr>
<!-- title -->
<tr align="left" valign="top">
<td style="font-family: 'Open Sans', Arial, sans-serif; font-size:18px; color:#3b3b3b; line-height:30px; font-weight: bold;" mc:edit="1/1 panel title">*|FEEDITEM:TITLE|*</td>
</tr>
<!-- end title -->
<tr>
<td height="10"></td>
</tr>
<!-- content -->
<tr valign="top">
<td style="font-family: 'Open Sans', Arial, sans-serif; font-size:13px; color:#7f8c8d; line-height:26px;" mc:edit="1/1 panel content">*|FEEDITEM:CONTENT_TEXT|*</td>
</tr>
<!-- end content -->
*|END:FEEDITEMS|*
*|END:FEEDBLOCK|*
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
And here is the feed: http://louerunmanager.com/feed/.
As stated in MailChimp's documentation, FEEDITEM:IMAGE should display the content of media:content i.e. the featured image...
Any idea?
Thanks!
The |FEEDITEM:IMAGE| and the |RSSITEM:IMAGE| grab the <media:content /> from the RSS feed, not the url from the image.
Instead of including the mailchimp tag as it is in the code in example:
<img src="*|FEEDITEM:IMAGE|*">
Try placing the tag by itself or inside the
<td>*|FEEDITEM:IMAGE|*</td>
or
<div>*|FEEDITEM:IMAGE|*</div>
It worked for me.
Check the example in the Mailchimp blog article: https://blog.mailchimp.com/rss-to-email-enhancement-for-publishers/
I am getting a strange 'The webpage cannot be found' error in my Wordpress 3.4.1 Blog. I have disabled all possible plug ins that could be the cluprit. This error only happens in Explorer and Opera but works fine in Firefox, Chrome, and Safari. This only happens in two sections under the Event Manager plugin but I even disabled that one but happens only in one content posting. The other strange item is this box randomly shows in each display so it is not fixed. Can anyone help me out or point me in the right direction before I lose all my hair? I am not sure if I am allowed to post links in questions at stackoverflow.com
I managed to track down some generated code thanks to Debug Bar in Internet Explorer:
<html><head>
<link rel="stylesheet" type="text/css" href="ErrorPageTemplate.css">
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
<title>HTTP 400 Bad Request</title>
<script language="javascript" type="text/javascript" src="errorPageStrings.js">
</script>
<script language="javascript" type="text/javascript" src="httpErrorPagesScripts.js">
</script>
</head><body onload="javascript:initHomepage(); expandCollapse('infoBlockID', true); initGoBack(); initMoreInfo('infoBlockID');">
<table border="0" cellSpacing="0" cellPadding="0" width="730">
<!-- Error title -->
<tbody><tr>
<td id="infoIconAlign" vAlign="top" rowSpan="2" width="60" align="left">
<img id="infoIcon" alt="Info icon" src="info_48.png">
</td>
<td id="mainTitleAlign" vAlign="middle" width="*" align="left">
<h1 id="mainTitle">The webpage cannot be found</h1>
</td>
</tr>
<tr>
<!-- This row is for HTTP status code, as well as the divider-->
<td id="http400Align" class="errorCodeAndDivider" align="right"><id id="http400"> HTTP 400</id>
<div class="divider"></div>
</td>
</tr>
<!-- Error Body -->
<!-- What you can do -->
<tr>
<td>
</td>
<td id="likelyCausesAlign" vAlign="top" align="left">
<h3 id="likelyCauses">Most likely causes:</h3>
<ul>
<li id="causeErrorInAddress">There might be a typing error in the address.</li>
<li id="causeLinkOutOfDate">If you clicked on a link, it may be out of date.</li>
</ul>
</td>
</tr>
<tr>
<td>
</td>
<td id="whatToTryAlign" vAlign="top" align="left">
<h2 id="whatToTry">What you can try:</h2>
</td>
</tr>
<!-- retype address -->
<tr>
<td>
</td>
<td id="retypeAddressAlign" vAlign="middle" align="left">
<h4>
<table>
<tbody><tr>
<td vAlign="top">
<img class="actionIcon" border="0" alt="" src="bullet.png">
</td>
<td vAlign="top">
<id id="retypeAddress">Retype the address.</id>
</td>
<tr>
</tr></tbody></table>
</h4>
</td>
</tr>
<!-- back to previous page -->
<tr>
<td>
</td>
<td id="goBackAlign" vAlign="middle" align="left">
<h4>
<table>
<tbody><tr>
<td vAlign="top">
<img class="actionIcon" border="0" alt="" src="bullet.png">
</td>
<td vAlign="top">
<span id="goBackContainer">Go back to the previous page.</span><noscript id="goBack">Go back to the previous page.</noscript>
</td>
</tr>
</tbody></table>
</h4>
</td>
</tr>
<!-- top level domain-->
<tr>
<td>
</td>
<td id="mainSiteAlign" vAlign="middle" align="left">
<h4>
<table>
<tbody><tr>
<td vAlign="top">
<img class="actionIcon" border="0" alt="" src="bullet.png">
</td>
<td vAlign="top">
<id id="mainSite1">Go to </id><span id="homepageContainer"><noscript id="mainSite2">the main site</noscript></span><id id="mainSite3"> and look for the information you want.</id>
</td>
</tr>
</tbody></table>
</h4>
</td>
</tr>
<!-- InfoBlock -->
<tr>
<td id="infoBlockAlign" vAlign="top" align="right">
</td>
<td id="moreInfoAlign" vAlign="middle" align="left">
<h4>
<table>
<tbody><tr>
<td vAlign="top">
<a onclick="javascript:expandCollapse('infoBlockID', true); return false;" href="#"><img id="infoBlockIDImage" class="actionIcon" border="0" alt="More information" src="down.png"></a>
</td>
<td vAlign="top">
<span id="moreInfoContainer">More information</span>
<noscript><ID id="moreInformation">More information</ID></noscript>
</td>
</tr>
</tbody></table>
</h4>
<div style="display: none;" id="infoBlockID" class="infoBlock">
<p id="errorExplanation">This error (HTTP 400 Bad Request) means that Internet Explorer was able to connect to the web server, but the webpage could not be found because of a problem with the address.</p>
<p id="moreInfoSeeHelp">For more information about HTTP errors, see Help.</p>
</div>
</td>
</tr>
</tbody></table>
I hope this helps.
Thanks
After doing a Windows GREP, I managed to find the culprit Wordpress plugin. It was 'All in One Adsense and YPN' which makes sense. All is well now. Thanks to those that cared to try to help out.