Here I have code in which php echoes out the number of followers, the result is displayed under Followers wrapped in h2 tags but in the start of line i.e, under Fo, I just want to display numbers in somewhat center under followers adding several   to echo mysqli_num_rows($resultfollowers); does the work but is their any one word alternative for that rather than typing several  
<h2>Followers</h2>
<?php
$checkfollowers = "SELECT * FROM follow_user WHERE user_id='$user_id'";
$resultfollowers = mysqli_query($con,$checkfollowers);
echo mysqli_num_rows($resultfollowers);
?>
Yes. Use CSS to set a width for the container and use text-align: center; to center the text.
Visual presentation has nothing to do with MySQL or PHP.
Example with inline styles:
echo sprintf( '<p style="width: 20em; text-align:center;">%s</p>', $resultfollowers );
Related
I am attempting to add text beneath the product gallery images of my Wordpress Woo-commerce site.
I have attempted to use the general scripts found online:
add_action( 'woocommerce_after_single_product_summary' , 'bbloomer_add_below_prod_gallery', 5 );
function bbloomer_add_below_prod_gallery() {
echo '<div class="woocommerce-product-gallery" style="background: #fdfd5a; padding: 1em 2em">';
echo '<span>THIS IS A TEST. YOU CAN ADD TEXT, IMAGES AND ANY HTML</span>';
echo '</div>';
}
You can see in the following screenshot that the text appears here and not beneath the actual image
The website link this is referencing can be found at: https://www.tattiniboots.com/product/retriever/
Update:
After trying the proposed solution below, the div text shows all the way at the bottom:
I am attempting to get this div to appear here:
The link I am working at is found here: https://www.tattiniboots.com/product/terranova/
You need to add style clear:both in your div. check the below code.
add_action( 'woocommerce_after_single_product_summary' , 'bbloomer_add_below_prod_gallery', 5 );
function bbloomer_add_below_prod_gallery() {
echo '<div class="woocommerce-product-gallery" style="background: #fdfd5a; padding: 1em 2em; clear:both;">';
echo '<span>THIS IS A TEST. YOU CAN ADD TEXT, IMAGES AND ANY HTML</span>';
echo '</div>';
}
How can I have different breadcrumbs background pictures, depending on visited page? Is this possible without using some additional modules?
You really don't need a module for this. What you can do is specify a div id on each page (in the content), and then, you will have a CSS that is something like the following:
#page-123 .breadcrumb{
background-color: #ff0000; /* background color is red */
}
I think the easiest way is to modify the index.php file of your template:
Something along the lines:
<head>...</head>
<?php
$params = &$app->getParams();
$pageclass = $params->get('page_title');
$pageclassname = str_replace(' ', '-' ,strtolower($pageclass));
?>
<body id="<?php echo $pageclassname; ?>"> ... </body>
That way you have a nice id that you can use for all your styling needs and your css code is more readable.
On pageload, following code to list items in box
{foreach from=$results key=k item=video_data name=loop}
<div class="list"><ul class="pic-list">
<li class="Li01" style="visibility: visible; opacity: 1;">...</li></u1>
</div>
{/foreach}
It display data perfectly...now i like to have insert empty div to include ad.
I like to display 3 blocks of elements, each block will have one big unit for ad, and 8 video elements.
please check attached picture for better understanding.
Can anyone please help me to rearrage layout as in img.
Thanks
I would have a for loop iterate 4 times, and nest a foreach loop inside it.
For the ad, you can add it in the foreach loop after throwing in the ul. Below is a rough example (I'm assuming your data is coming in through a multi-dimensional array):
$results_array = [whatever your array output consists of];
for($i = 0; $i < 4; $i++){
echo '<ul class="pic-list"><li class="ad"></li>';
foreach($results_array[$i] as $j => $item){
echo '<li class="video"></li>';
}
echo '</ul>';
}
I want to make a long list of elements, images for example that will be added into the grid which width is span12 and every elements width should be span3, that makes 4 elements in 1 row.
The problem is, when I list all the elements or I make a php function that lists them Boostrap thinks I want to put it in one row, but I don't. I want to make a new row every 4 elements or so... I want to be able to add as many <li> as I want and not worry about where another row should be.. What should I do ?
This is what happened to me, the 5th image has wrong margin on the left side. I want to make it in the same position as images in the first row.
Screenshot here
I use this php logic to echo out pictures
$dir = "../img";
if (is_dir($dir)) {
if ($dh = opendir($dir)) {
while (($file = readdir($dh)) !== false) {
if (preg_match("/.jpg/", $file)) {
echo "<li class='span3'>
<a href='$dir/$file' class='thumbnail'>
<img src='$dir/$file'>
</a>
</li>
";
}
}
closedir($dh);
}
}
And I have no idea on how to post a new row each 4th picture or so.
Row is marked as <div class='row-fluid'>
That's a common problem, and I think there's no elegant solution. Consider one of these approachings.
Solution 1 Review your iteration logic
If refactoring your PHP logic is an option, try to render a row each 4 elements (I can't suggest an specific code without viewing your current logic).
EDIT
The code for a while loop could be as follows:
<?php
$count = 1;
echo '<div class="row">';
while (your_condition) {
echo '<div class="span3">your_content</div>';
if ($count % 4 == 0) {
echo '</div>';
echo '<div class="row">';
}
$count++;
}
echo '</div>';
Solution 2 Hack the fifth element's margin
Correct the margin-left of the affected elements, so you don't need to respect the native Bootstrap markup.
.thumbnails .span4:nth-child(4n+1) {
margin-left: 0;
}
Unfortunately, that code is not compatible with Internet Explorer, so maybe you'll have to find a JavaScript or jQuery solution.
I've noticed that on some product pages of my site (but not all) I'm getting a strange issue where one of the product images appears in the row below the one it's meant to.
So on some pages the 'People who bought this also purchased...' images, on the last line one of the products drops down a line and is obviously out of place.
http://tinyurl.com/cs6d3q5
but most other pages are fine!
http://tinyurl.com/clwq3dz
I can't figure out whats the problem. As far as I can see they should both act the same way. Can anyone enlighten me and also tell me how they debugged it? I use Firebug and developer tools on FF but they don't seem as useful as they once did
thanks
here's the code used to create it:
if($also_purchased_products->RecordCount() > 0) {
echo '<div style="clear:both"></div>';
echo '<div class="sideboxHeading">People who bought this also purchased...</div> <div class="ProdInfoDotSpacer"></div>';
while (!$also_purchased_products->EOF) {
$also_purchased_products->fields['products_name'] = zen_get_products_name($also_purchased_products->fields['products_id']);
echo '<div class="alsoPurchasedWrapper">';
echo '' . zen_image(DIR_WS_IMAGES . $also_purchased_products->fields['products_image'], $also_purchased_products->fields['products_name'], SMALL_IMAGE_WIDTH, SMALL_IMAGE_HEIGHT) . '<br />';
echo '' . $also_purchased_products->fields['products_name'] . '';
echo '</div>';
$also_purchased_products->MoveNext();
}
}
its because
Black/Sage Guinness harp knit
here Black/Sage Guinness harp knit scarf is long try sorting it
The problem appears when the previous item text link is more than one line long. You can truncate it, as NullPointer says, or set a height on .alsoPurchasedWrapper:
.alsoPurchasedWrapper {
float: left;
width: 150px;
margin: 5px 0px 10px 20px;
height: 170px;
}