In my code, I have a center tag and have styled the center tag so it looks the way I want it to look. It currently looks like this:
Whenever I go on my admin account (one that has a different user id than the normal users) it looks way different than if a regular user would see it. It looks like this:
I would like to know if there is any way around this so it looks the same as if a regular would see it on an admin account.
I've tried putting a div tag around it and using the same styling features, but that didn't work. I've tried putting the center tag around different parts of the code, but since it's an "if" statement, it will look different.
Here is the code:
<style>
center{
border-left: .17em dashed;
border-top: .17em solid;
border-right: .17em dashed;
border-bottom: .17em solid;
padding-left:25px;
padding-bottom: 20px;
width: 1000px;
background-color: #E1A0A0;
border-color: black;
margin: auto;
text-align: left;
}
</style>
<?php
while ($row = mysqli_fetch_array($result, MYSQLI_ASSOC)) {
echo '<center><b><h2>' . $row['title'] . '</h2></b>' . $row['post'] . '<br/><br/> <b>Posted On: </b>' . $row['postdate'] . '<br/>View Post Comments | ';
if($_SESSION['user_id'] == 3) {
echo '<a href="update.php?id=' . $row['blogid'] . '" >Update Blog Post</a> | <a href="' . basename(__FILE__) . '?id=' . $row['blogid'] . '" >Delete Blog Post</a></center>';
}
}
?>
I know that I can't just put another center tag around the
"echo '<center><b><h2>' . $row['title'] . '</h2></b>' . $row['post'] . '<br/><br/> <b>Posted On: </b>' . $row['postdate'] . '<br/>View Post Comments |';"
part of the code and
"echo '<a href="update.php?id=' . $row['blogid'] . '" >Update Blog Post</a> | <a href="' . basename(__FILE__) . '?id=' . $row['blogid'] . '" >Delete Blog Post</a></center>';"
part of the code because it will look like this:
Additionally, if I put the center tag around everything, it will look like this:
I just want to make it look the same no matter who views it.
after the close of the if(){} you need to echo '</center>' and remove it from inside the if(){}. You have setup a loop where sometimes center is not closed
echo '<center><b><h2>' . $row['title'] . '</h2></b>' . $row['post'] . '<br/><br/> <b>Posted On: </b>' . $row['postdate'] . '<br/>View Post Comments | ';
if($_SESSION['user_id'] == 3) {
echo '<a href="update.php?id=' . $row['blogid'] . '" >Update Blog Post</a> | <a href="' . basename(__FILE__) . '?id=' . $row['blogid'] . '" >Delete Blog Post</a>';
}
echo '</center>';
Not sure if I quite understand what is being asked for, but if all you want to do is make everything look like the last image you posted, remove this in the css:
padding-left:25px;
In my code I use this MySQL query:
$qry="SELECT ServiceIcon FROM Services INNER JOIN UserServices ON UserServices.ServiceID=Services.ServiceID WHERE UserServices.UserID=$_SESSION[SESS_MEMBER_ID]";
$result=mysql_query($qry);
header("Content-type: image/png");
echo mysql_result($result,0);
I want these images to be displayed in a grid of 3 icons wide. Currently they're displayed on top of each other however. So I should echo an like this:
echo '<ul>';
foreach ($images as $image) {
echo '<li><img src="' . $image['src'] . '" id="' . $image['id'] . '" /></li>';
}
echo '</ul>';
What I don't understand is how I should incorporate into my code. Or maybe my code is not even the right way to do it. Please help me out.
EDIT: So this is the complete file in question:
<?php
session_start();
include "connection.php";
// just so we know it is broken
error_reporting(E_ALL);
// some basic sanity checks
$qry="SELECT ServiceIcon FROM Services INNER JOIN UserServices ON UserServices.ServiceID=Services.ServiceID WHERE UserServices.UserID=$_SESSION[SESS_MEMBER_ID]";
$result=mysql_query($qry);
header("Content-type: image/png");
?>
<html>
<head>
<style>
ul.horizontal-display {
margin: 0;
padding: 0;
}
ul.horizontal-display li {
list-style: none;
display: inline-block;
}
</style>
</head>
<body>
<?php
echo '<ul class="horizontal-display">';
foreach ($images as $image) {
echo '<li><img src="' . $result . '" id="' . $image['id'] . '" /></li>';
}
echo '</ul>';?>
</body>
</html>
Hello you need to add CSS. Something like this:
echo '<ul class="horizontal-display">';
foreach ($images as $image) {
echo '<li><img src="' . $image['src'] . '" id="' . $image['id'] . '" /></li>';
}
echo '</ul>';
And in the CSS rules
ul.horizontal-display {
margin: 0;
padding: 0;
}
ul.horizontal-display li {
list-style: none;
display: inline-block;
}
Here is my code to show blob images on my webpage..
$sql = mysql_query("SELECT slider_id,date,page_image FROM news_slider where date='$ndate' order by slider_id ASC LIMIT $start, $limit");
// the result of the query
// $result = mysql_query("$result") or die("Invalid query: " . mysql_error());
while ($slider_rs = mysql_fetch_array($sql)) {
$sl_id = $slider_rs['slider_id'];
$sl_img = $slider_rs['page_image'];
echo '<div class="showcase-slide">';
echo '<div class="showcase-content">';
echo '<div class="map" style="display: block; background-image:url(' . base64_encode($sl_img) . '); position: relative; padding: 0px; width: 518px; height: 801px; background-position: initial initial; background-repeat: initial initial;">';
echo '<canvas style="width: 518px; height: 801px; position: absolute; left: 0px; top: 0px; padding: 0px; border: 0px; opacity: 0.9999999999999999;" height="801" width="518"></canvas>';
echo '<img id="image' . $sl_id . '" class="map maphilighted" usemap="#Map' . $sl_id . '" src="data:image/jpeg;base64, ' . base64_encode($sl_img) . ' " align="top" style="border: 0px; opacity:0.9999999999999999; position: absolute; left: 0px; top: 0px; padding: 0px;">;';
echo '</div>';
echo '<span id="Label1" style="display:inline-block;height:1px;width:1px;">';
echo '<map name="Map' . $sl_id . '">';
$get_list = "select news_id,x1,y1,x2,y2 from cords where slider_id='{$sl_id}'";
$get_list_res = mysql_query($get_list) or die("Invalid query: " . mysql_error());
if (mysql_num_rows($get_list_res) > 0) {
while ($add_cords = mysql_fetch_array($get_list_res)) {
$news_id = $add_cords[news_id];
$a = $add_cords[x1];
$b = $add_cords[y1];
$c = $add_cords[x2];
$d = $add_cords[y2];
echo '<area shape="rect" coords="' . $a . ',' . $b . ',' . $c . ',' . $d . '" "href=" " onclick="showUser(' . $news_id . ')" alt=" " title=" " id="' . $news_id . '" >' . "\n";
}
}
echo ' </map>';
echo '</span>';
echo '</div>';
echo '</div>';
}
// close the db link
mysql_close($link);
but problem is images are not dispay on chrome and IE???
i used pagination for paginate images.
Please give any solution?
I think you need to also include the mimetype and a base 64 header:
Try changing this:
background-image:url('.base64_encode($sl_img).');
...to this:
background-image:url(data:image/jpeg;base64,'.base64_encode($sl_img).');
Certainly this only works if the blob is a JPEG. You'd use image/png if it's a PNG, for instance.
See this page for a more flexible implementation: http://devin.la/blog/base64-encode-images-css-script-mobile
I'm having trouble styling the information that I'm pulling from the database. If anyone can help I'd really appreciate it. I tried defining $style within the while loop, and then assigning it the $questions, but nothing happens on the webpage. I'm new with coding in general, and while I have some knowledge of css, I don't know how you use it within php script.
style for the background I was trying to put behind each question*
#frm1
{
background: #D9D9D9;
margin:auto;
top:150px; left:200px; width:880px; height:60px;
position:absolute;
font-family: "Comic Sans MS", cursive, sans-serif;
font-size: 9px;
font-style: italic;
line-height: 24px;
font-weight: bold;
text-decoration: none;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
padding:10px;
border: 1px solid #999;
border: inset 1px solid #333;
-webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.5);
box-shadow: 0px 0px 40px rgba(0, 0, 0, 0.7);
}
PHP code retrieving info from database*
if (mysql_num_rows($result) >= 0)
{
$toggle = false;
while ($rows = mysql_fetch_array($result, MYSQL_ASSOC) and $i<10 )
{
$i++;
$toggle = !$toggle;
if($toggle)
$style = "id:frm1;";
else
$style = "background: white;";
questions .= "<a style='$style'> </a>";
questions .= "Titlee: " ."<a href='show_question2.php?question_id=" . $rows["question_id"] . "'>". $rows['title'] . "</a> <br> ";
questions .= "Details: " . "<a href='show_question2.php?question_id=" . $rows["question_id"] . "'>". $rows['detail'] . "</a> <br> ";
questions .= "Category: " . "<a href='show_question2.php?question_id=" . $rows["question_id"] . "'>". $rows['categories'] . "</a> <br> <br> <br> ";
}
echo questions;
}
while I have some knowledge of css, I don't know how you use it within
php script.
Okay.
Your PHP script is a PHP script on the server, and results in a regular HTML page for the user. [See the bottom of the answer, I'll try to give you a quick overview]
You can use CSS exactly as you would with a plain HTML page, and it will work just fine despite being backed by PHP.
This means do not use style="$style". Style attributes are Bad.
As it looks like you want to construct your CSS conditionally, my suggestion is either:
Change a class using PHP, and have an external stylesheet which acts on that class
Put the styles you're conditionally changing inside <style> tags in your header, and change those with PHP.
This answer will use the first option
(Edited to take into account new information)
In your PHP code, before your links:
if($toggle) {
$questions.='<div id="frm1">';
}
else {
$questions.='<div id="frm2">';
}
In your PHP code, after your links:
$questions .= "</div>";
And finally, in either your external stylesheet, or your in-head <style> tags:
#frm1 {
...
}
#frm2 {
...
}
Quick overview of server-side languages
So, web programming. This is generally done in two ways. client side (read: javascript) and server side (in your case, read: php, but there's a lot more to this).
With a client side language like javascript, the code actually gets sent to the web browser. The web browser then modifies the contents of the page according to what the script says for it to do. This means your users can see the code, even turn it off in their web browser or execute other javascript in its place.
With a server side language, there's a different workflow.
The user asks for your webpage (identified by its URL)
The web server (read: your webhosting) receives this request, and looks up what the webpage is
Finding that the webpage is a php page, the server executes the php code
The php code gives the server an html page (which you have built, as you can see, your php script outputs HTML)
The server sends the resulting html code to the user
Note that the web browser, which is the component doing all of the processing of HTML and CSS, never sees the php. By the time your php script reaches your users, it's just an html page.
Because the web browser only sees an HTML page, there is no functional difference between using CSS on your php script, and using CSS on a regular HTML page.
This will work:
if (mysql_num_rows($result) >= 0) {
$toggle = false;
while ($rows = mysql_fetch_array($result, MYSQL_ASSOC) and $i<10 ) {
$i++;
$toggle = !$toggle;
if($toggle)
$style = "background: #D9D9D9;"; else
$style = "background: green;";
questions .= "<a href='#' style='display:block;$style'> </a>";
questions .= "Titlee: " ."<a href='show_question2.php?question_id=" . $rows["question_id"] . "'>". $rows['title'] . "</a> <br> ";
questions .= "Details: " . "<a href='show_question2.php?question_id=" . $rows["question_id"] . "'>". $rows['detail'] . "</a> <br> ";
questions .= "Category: " . "<a href='show_question2.php?question_id=" . $rows["question_id"] . "'>". $rows['categories'] . "</a> <br> <br> <br> ";
}
echo questions;
}
The problem was your a-tag doesn't have a href attribute and since it's displayed inline (default-behaviour) the background CSS property won't work.
Instead of style, build classes and define them in css.
if ($toggle)
$questionClass="redBackground";
else
$questionClass="greenBackground";
$questions.="<a class='$questionClass'>";
Also, definitely look into mysqli or pdo. mysql_ functions are deprecated and not nearly as cool!
You can do -
if (mysql_num_rows($result) >= 0)
{
$toggle = false;
while ($rows = mysql_fetch_array($result, MYSQL_ASSOC) and $i<10 )
{
$i++;
$toggle = !$toggle;
if($toggle)
$style = "bg";
else
$style = "bg_green";
echo("<a class='".$style."'> </a>");
echo("Titlee: " ."<a href='show_question2.php?question_id=" . $rows["question_id"] . "'>". $rows['title'] . "</a> <br> ");
echo("Details: " . "<a href='show_question2.php?question_id=" . $rows["question_id"] . "'>". $rows['detail'] . "</a> <br> ");
echo("Category: " . "<a href='show_question2.php?question_id=" . $rows["question_id"] . "'>". $rows['categories'] . "</a> <br> <br> <br> ");
}
In this file add -
<style type="text/css">
.bg {
background: #D9D9D9;
}
.bg_green {
background: green;
}
</style>
As ben said use class.
first create a class
<style>
.gray{background: #D9D9D9;}
.green{background: green;}
</style>
Then try this
if (mysql_num_rows($result) >= 0)
{
$toggle = false;
while ($rows = mysql_fetch_array($result, MYSQL_ASSOC) and $i<10 )
{
$i++;
$toggle = !$toggle;
$style = ($toggle)?"green":"gray";
$questions .= "<a class='".$style."'> Put some thing here </a>";
$questions .= "Titlee: " ."<a href='show_question2.php?question_id=" . $rows["question_id"] . "'>". $rows['title'] . "</a> <br> ";
$questions .= "Details: " . "<a href='show_question2.php?question_id=" . $rows["question_id"] . "'>". $rows['detail'] . "</a> <br> ";
$questions .= "Category: " . "<a href='show_question2.php?question_id=" . $rows["question_id"] . "'>". $rows['categories'] . "</a> <br> <br> <br> ";
}
echo $questions;
}
Please try it, I have not tested but it should work, according to your need.
You can alternate on your counter $i with $i % 2 to switch between two CSS classes. This will give you 0, 1, 0, 1, 0, 1, ... and so select the first and second CSS class name in turn.
PHP:
$css_class = array('frm1', 'second');
while ($rows = mysql_fetch_array($result, MYSQL_ASSOC) and $i<10 )
{
$i++;
questions .= "<a class='$css_classes[$i % 2]'> </a>";
questions .= "Titlee: " ."<a href='show_question2.php?question_id=" . $rows["question_id"] . "'>". $rows['title'] . "</a> <br> ";
questions .= "Details: " . "<a href='show_question2.php?question_id=" . $rows["question_id"] . "'>". $rows['detail'] . "</a> <br> ";
questions .= "Category: " . "<a href='show_question2.php?question_id=" . $rows["question_id"] . "'>". $rows['categories'] . "</a> <br> <br> <br> ";
}
and in your CSS file you define the two classes
.frm1 {
background: #D9D9D9;
margin:auto;
top:150px; left:200px; width:880px; height:60px;
position:absolute;
...
}
.second {
background: white;
}
Hi guys and thank you for your time. My question is regarding.
I am trying to loop over images in my folder along with a post in the database with the end result looking like this:
Post 1 Image 1
Post 2 Image 2
Post 3 Image 3
At the moment i get this result:
Post 1 Image 1
Post 1 Image 2
Post 1 Image 1
Post 2 Image 1
Post 2 Image 2
Post 2 Image 3
I do not want this result.
Below is my code:
$post_info = get_posts();
foreach ($post_info as $info){
$photos = glob('design/img/*');
foreach($photos as $photo) {
echo " <a href='feed.php?pid=".$info['post_id']." ' >
<div style='background:#FFF5C3'> <br> <h2> ".$info['person_mentioned']." </h2>
<h3 style='color: black'> ".$info['body']." </h3> </div> </a>";
echo " <img src='{$photo}' width='285px' height='200px' style='border: 5px solid black'>";
}
}
Thanks for your time.
Try this out (minus potential language specifics since I didn't actually run to check this code).. It's basically a regular for loop instead of a foreach.
$post_info = get_posts();
$photos = glob('design/img/*');
if (count($post_info) === count($photos)) { // According to your requirement, the counts would be the same
$count = count($post_info);
for ($i = 0; $i < $count; $i++) {
$info = $post_info[$i];
$photo = $photos[$i];
echo " <a href='feed.php?pid=".$info['post_id']." ' > <div style='background:#FFF5C3'> <br> <h2> ".$info['person_mentioned']." </h2>
<h3 style='color: black'> ".$info['body']." </h3> </div> </a>";
echo " <img src='{$photo}' width='285px' height='200px' style='border: 5px solid black'>";
}
}
Hope that helps :)
Getting image details from get_posts() and removing inner foreach loop may fix your problem.
Note: replace $info['something_like_post_image'] with your image field.
$post_info = get_posts();
foreach ($post_info as $info) {
//$photos = glob('design/img/*');
//foreach ($photos as $photo) {
echo " <a href='feed.php?pid=" . $info['post_id'] . " ' >
<div style='background:#FFF5C3'> <br> <h2> " . $info['person_mentioned'] . " </h2>
<h3 style='color: black'> " . $info['body'] . " </h3> </div> </a>";
echo " <img src='" . $info['something_like_post_image'] . "' width='285px' height='200px' style='border: 5px solid black'>";
//}
}
UPDATE
/*
* If your images have any naming convention like
* imageFileName = "image_{POST_ID}.jpg"
* then you can use below code (NO DATABASE ENTRY REQUIRED)
* (ie, For post #1 image file would be "image_1.jpg";
* and for post #2 image file would be "image_2.jpg")
*/
$post_info = get_posts();
foreach ($post_info as $info) {
//filename = image_1.jpg or image_2.jpg or...
$photoFileName = 'design/img/' . 'image_' . $info['post_id'] . '.jpg';
if (file_exists($photoFileName)) {
echo " <a href='feed.php?pid=" . $info['post_id'] . " ' >
<div style='background:#FFF5C3'> <br> <h2> " . $info['person_mentioned'] . " </h2>
<h3 style='color: black'> " . $info['body'] . " </h3> </div> </a>";
echo " <img src='" . $photoFileName . "' width='285px' height='200px' style='border: 5px solid black'>";
}
}
NOTE: You should have to keep a relation with each post against your unique image; otherwise you will not be able to get that unique image with your post, while listing.
Checkout below options to handle this situation.
You can keep image name in database (for each post, you can get your image name directly from database)
Use a naming convention for your images (for post #1 use unique image name (say image_1, for post #2 image_2 etc)
UPDATE - 2
If you are looking for a cycle-through images (without any condition), use below code
/*
* If you are looking for a solution that cycles each images
* along with each post, try this one
*/
$post_info = get_posts();
$photos = glob('design/img/*');
$numPhotos = count($photos) + 1;
//assuming your post# starts with 1
$imageId = 1;
foreach ($post_info as $info) {
//cycling
if ($imageId % $numPhotos === 0) {
$imageId = 1;
}
$photoFileName = 'design/img/' . 'image_' . $imageId++ . '.jpg';
//no need of this checking, since you are cycling
//if (!file_exists($photoFileName)) {
// $photoFileName = 'path/to/default/image.jpg';
//}
echo " <a href='feed.php?pid=" . $info['post_id'] . " ' >
<div style='background:#FFF5C3'> <br> <h2> " . $info['person_mentioned'] . " </h2>
<h3 style='color: black'> " . $info['body'] . " </h3> </div> </a>";
echo " <img src='" . $photoFileName . "' width='285px' height='200px' style='border: 5px solid black'>";
}