Controllable table fields in PHP/HTML - php

Im creating a website where there are table (10x10) with adverts inside (pictures+links). I created this table and created one advert, which leads to testlink.com and has picture "img100x100.png". How could i change the code, so I can get different links and images for each table data cell? Please explain as much as possible, because I have just started to learn PHP & MySQL.
I currently have the following code in index.php:
<?php include 'header.php'; ?>
<body>
<?php
$rows_max = 10;
$columns_max = 10;
$links = Array(
'link' => "http://testlink.com",
'image' => "img100x100.png");
print '<table border="1px" style="border-collapse:collapse;">';
for($row = 1; $row <= $rows_max; $row++)
{
print '<tr>';
for($col = 1; $col <= $columns_max; $col++)
{
print '<td width="10px" height="10px" background="'.$links["image"].'" >';
print '<center> </center>';
print '</td>';
}
print '</tr>';
}
print '</table>';
include 'footer.php'; ?>
and
td a
{
width: 100%;
height: 100%;
display: block;
margin-top: 0px auto;
}

Well you could link this up to a database with 10 rows and foreach through those. Or even simpler, you could have this all in an array. It would be a lot easier if you didn't use a table and just made them square with CSS and floated them left in a container. You would get a similar result.
$links = array(
array(
'url' => 'http://link.com/',
'image' => 'image.jpg'
), array(
'url' => 'http://link.com/',
'image' => 'image.jpg'
), array(
'url' => 'http://link.com/',
'image' => 'image.jpg'
)
// etc
);
Then
foreach($links as $link){
// Code to build out a cell
echo $link['url'];
echo $link['image'];
}

Related

Adding the_post_thumbnail(); via css

I'm trying to set my posts page so that each post item loads with it's featured image as it's background. My code is working properly, but how do I add the post thumbnail as the background for each post? My code is attached below
<?php
/**
* The main template file.
*
* This is the most generic template file in a WordPress theme
* and one of the two required files for a theme (the other being style.css).
* It is used to display a page when nothing more specific matches a query.
* E.g., it puts together the home page when no home.php file exists.
* Learn more: http://codex.wordpress.org/Template_Hierarchy
*
* #package Clean Blog
*/
get_header(); ?>
<?php
// Custom loop that adds a clearing class to the first item in each row
$args = array('numberposts' => -1, 'order' => 'ASC' ); //For this example I am setting the arguments to return all posts in reverse chronological order. Odds are this will be a different query for your project
$allposts = get_posts($args);
$numCol = 2; // Set number of columns
// Start Counter
$counter = 0;
foreach ($allposts as $post) {
$content = '<div class="col-md-6 columns-'.$numCol.($counter % $numCol == 0 ? ' first' : '').'">'; // Add class to first column
$content .= '<h3>'.$post->post_title.'</h3>';
$content .= $post->post_content;
$content .= '</div>';
echo $content;
$counter ++;
}
?>
<style type="text/css">
/* Added styles here for the demo, but ideally you would put this in a stylesheet.*/
.columns-2 {
float:left;
}
.first {
clear:both;
margin-left:0;
}
</style>
<!-- /.col-lg-8.col-lg-offset-2.col-md-10.col-md-offset-1 -->
<?php get_footer(); ?>
UPDATE
I've now tried adding it as an inline style, but the raw style is showing up on the page. I feel like I'm missing something easy
http://imgur.com/kkATCAC
<?php
// Custom loop that adds a clearing class to the first item in each row
$args = array('numberposts' => -1, 'order' => 'ASC' ); //For this example I am setting the arguments to return all posts in reverse chronological order. Odds are this will be a different query for your project
$allposts = get_posts($args);
$numCol = 2; // Set number of columns
$thumbnail = get_the_post_thumbnail( $page->ID, 'thumbnail' );
// Start Counter
$counter = 0;
foreach ($allposts as $post) {
$content = '<div class="col-md-6 columns-'.$numCol.($counter % $numCol == 0 ? ' first' : '').'" style="background: url("${thumbnail}") center center/cover no-repeat;">'; // Add class to first column
$content .= '<h3>'.$post->post_title.'</h3>';
$content .= $post->post_content;
$content .= '</div>';
echo $content;
$counter ++;
}
?>
UPDATE 2
I've checked the quotes but now I'm getting a parse error and the page doesn't load at all.
$content = '<div style="background: url('${thumbnail}') center center/cover no-repeat;" class="col-md-6 columns-'.$numCol.($counter % $numCol == 0 ? ' first' : '').'">'; // Add class to first column
You could add it as an inline style:
<?php
$thumbnail = get_the_post_thumbnail( $page->ID, 'thumbnail' );
$content = "<div class='your-post-thing' style='background: url('${thumbnail}') center center/cover no-repeat;'>...stuff...</div>';
echo $content;
?>
OR
Depending on your browser support, you could use object-fit:
<?php
$content .= "<div class='your-post-thing'>";
$content .= "<img class='background-image' src='${thumbnail}' />";
$content .= "</div>";
echo $content;
?>
CSS:
.your-post-thing {
position: relative;
}
.background-image {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: cover;
}
$content = '<div style="background-image:url('.wp_get_attachment_url(get_the_post_thumbnail()).')" class="col-md-6 columns-'.$numCol.($counter % $numCol == 0 ? ' first' : '').'">'; // Add class to first column
you can try something like this, and in your css you can add the rules to view correctly the background.

PHP + CSS: Output Options Framework Content

Two questions from a coding ub3r n00b...
Firstly, I'm using the Options Framework Theme by Devin Price and just wanting to know how would I output the background property in the <head> section of my header.php file, from the Theme Options page only if the user has uploaded an image or chosen a color for this?
My options.php:
$options[] = array(
'name' => __('Background', 'options_framework_theme'),
'desc' => __('Add a background.', 'options_framework_theme'),
'id' => 'background-one',
'std' => $background_defaults,
'type' => 'background' );
My Theme Options page:
My header.php:
<style type="text/css">
<?php $background = of_get_option('background-one');
echo 'body {';
if ($background['color']) {
echo '
background: ' .$background['color']. ';';
}
if ($background['image']) {
echo '
background: url('.$background['image']. ') ';
echo ''.$background['repeat']. ' ';
echo ''.$background['position']. ' ';
echo ''.$background['attachment']. ';';
}
echo '
}';
?>
</style>
Which works perfectly fine in the front-end of my site, displaying the CSS as:
body {
background: #8224e3;
background: url(images/bg03.gif) repeat top left fixed;
}
But if the user hasn't chosen a colour or image as a background through the Theme Options page, the source code will output:
body {
}
How would I be able to remove the above CSS if the user hasn't chosen a background?
From what I gather, an if statement needs to be created but I don't how to write this up correctly as I'm fairly new to php.
Secondly, how would I be able to set a default background image in the framework?
My options.php:
// Background Defaults
$background_defaults = array(
'color' => '',
'image' => '',
'repeat' => 'no-repeat',
'position' => 'top left',
'attachment' => 'fixed' );
Thanks
Just move a few things to be within an if statement, like so:
<?php
$background = of_get_option('background-one');
if ($background['color'] || $background['image']) {
echo '<style type="text/css" >';
echo 'body {';
if ($background['color']) {
echo '
background: ' .$background['color']. ';';
}
if ($background['image']) {
echo '
background: url('.$background['image']. ') ';
echo ''.$background['repeat']. ' ';
echo ''.$background['position']. ' ';
echo ''.$background['attachment']. ';';
}
echo '
}';
echo '</style>';
}
?>
And, for your second question, simply make the following change:
// Set up a default image
// NOTE: This is designed for the image to be located in your theme folder, inside an images folder
$default = get_bloginfo("template_url") . 'images/default.jpg';
// Background Defaults
$background_defaults = array(
'color' => '',
'image' => $default,
'repeat' => 'no-repeat',
'position' => 'top left',
'attachment' => 'fixed' );

wordpress random tag issue

I am having issue with a wordpress Tag CLoud Plugin.
I want to show random tags but i am confused how to do this.
the codes are given below.
I want to show random tags. like if i select to show just 5 tags and when each time i refrest the screen the tags should appear randomly.
function widget_tagcloud($args){
$option_value = retrieve_options($opt_val);
extract($args);
echo $before_widget;
echo $before_title;
echo $option_value['title'];
echo $after_title;
global $wpdb;
$tags_list = get_terms('post_tag', array(
'orderby' => 'count',
'hide_empty' => 0
));
if(sizeof($tags_list)!=0){
$max_count = 0;
if(!empty($option_value['height'])) $canvas_height = $option_value['height'];
else $canvas_height = "250";
if(!empty($option_value['width'])) $canvas_width = $option_value['width'];
else $canvas_width = "250";
foreach($tags_list as $tag) if($tag->count > $max_count) $max_count = $tag->count;?>
<div id="myCanvasContainer">
<canvas width="<?php echo $canvas_width;?>" height="<?php echo $canvas_height;?>" id="myCanvas">
<p>Tags</p>
</canvas>
</div>
<div id="tags">
<ul style="
font-family: <?php if(!empty($option_value['font_name'])) echo $option_value['font_name'];
else echo "Calibri";?>;
height:
<?php
if(!empty($option_value['height'])) echo $option_value['height'];
else echo "250";
?>px;
width:
<?php
if(!empty($option_value['width'])) echo $option_value['width'];
else echo "250";
?>px;
background-color: #<?php if(!empty($option_value['bg_color'])) echo $option_value['bg_color'];
else echo "FFF";?>;
">
<?php
if(empty($option_value['no_of_tags'])) $option_value['no_of_tags'] = 15;
if(empty($option_value['txt_color'])) $option_value['txt_color'] = "000";
if(empty($option_value['max_font_size'])) $option_value['max_font_size'] = 40;
if(empty($option_value['min_font_size'])) $option_value['max_font_size'] = 3;
$i=1;
foreach($tags_list as $tag){
if($i <= $option_value['no_of_tags']){
$font_size = $option_value['max_font_size'] - (($max_count - $tag->count)*2);
if($font_size < $option_value['min_font_size']) $font_size = $option_value['min_font_size'];
echo '<li><a href="'.$_SERVER['PHP_SELF'].'?tag='.$tag->slug.'"
style="font-size:'.$font_size.'px;color: #'.$option_value['txt_color'].';">'
.$tag->name.'</a></li>';
$i++;
}
}
echo '</ul></div>';
}
else echo "No tags found";
echo $after_widget;
}
Accordind to your code: (this part especially)
$tags_list = get_terms('post_tag', array(
'orderby' => 'count',
'hide_empty' => 0
));
The tags which you get are ordered by count , therefore - they are not randomly picked.
You can try and use the next code:
$tags_list = get_terms('post_tag', array(
'number' => 5,
'orderby' => 'none',
'hide_empty' => 0
));
And if that doesn't work , build a customized query using the RAND function of mysql.
EDIT: based on your code , you can do is even easier by using the shuffle() php function.
Just replace:
$max_count = 0;
With:
$max_count = 5;
shuffle($tags_list);

multidimensional array

i have a multidimensional array like this
$role = array (
'Dashboard' => null,
'Students' =>
array (
'Admission' => array ( 0 => 'Entry' ,1 => 'Review' , 2 => 'Approved/Reject'
),
'Search' => null,
'AdvanceSearch' => null,
'Courses' => null
),
'HR' => array ('Settings' => null),
'Employee Management' => array ( 0 => 'Entry',1 => 'Association',2 => 'Search' ),
'Employee Attendance' => null,
'Payroll' => array (0 => 'Generate Pay Slip',1 => 'Payroll Run' , 2 => 'Payroll Revert',3 => 'View Pay Slips'),
'Finance' => null,
'More' => null);
and i want to print this array result in my html as
i am trying to do this by using recursion but unable to do that as DIV are not properly closed ..
here is the code that i am trying in my html
<?php
$child = 0;
function RecursiveWrite($array, $child ) {
$parent_array_size = count($array);
foreach ($array as $key => $vals) {
if(is_array($vals)){
$inner_array_size = count($vals);
echo "<div class='main clear'><input type='checkbox'/> ".$key." ";
RecursiveWrite($vals,$child);
}else{
$child = 0;
if(is_numeric($key)){
echo " <div class='left'> <input type='checkbox' class=''/> ".$vals." </div></div>";
}else{
echo "<div class='clear'><input type='checkbox'/> ".$key." </div></div>";
}
}
//
}
}
RecursiveWrite($role, $child);
?>
here is working code
How can i get this Any suggestion ... ?
Your Problem is missing closing div after recursion
Try this Function
function RecursiveWrite($array, $child )
{
$parent_array_size = count($array);
foreach ($array as $key => $vals)
{
if(is_array($vals))
{
$inner_array_size = count($vals);
echo "<div class='deep'><div class='extra'><input type='checkbox'/> ".$key."</div>";
RecursiveWrite($vals,$child);
echo "</div>";
}
else
{
if(is_numeric($key)){
echo "<span class='single'><input type='checkbox' class=''/> ".$vals."</span>";
}else{
echo "<div class='single'><input type='checkbox'/> ".$key." </div>";
}
}
}
}
Use This Css
<style type="text/css">
.parent {border: solid 1px #000;}
.parent div {border: solid 1px #000; margin:5px;}
.extra {border:0px !important;}
.single {margin-left:10px !important; border:0px !important;}
span.single {display:inline-block; margin-left:20px;}
</style>
Use this to call your Function
<div class="parent"><? RecursiveWrite($role, $child);?></div>
Put all the code Provided in one page with your array.
For better Codding standard you should Septate your style html and php for this try your luck ;)
You're not closing the div in the right places, when calling the recursion, right after ending the recursion you need to write the ending div:
open div
run recursion
close div
As well, you have two unnecessary div closing. Always make sure you open as many div as you close and vice versa. I've marked the places that needed to be changed in the code.
code:
<?php
$child = 0;
function RecursiveWrite($array, $child ) {
$parent_array_size = count($array);
foreach ($array as $key => $vals) {
if(is_array($vals)){
$inner_array_size = count($vals);
echo "<div class='main clear'><input type='checkbox'/> ".$key." ";
RecursiveWrite($vals,$child);
echo "</div>"; /* <== ADD THIS */
}else{
$child = 0;
if(is_numeric($key)){
echo " <div class='left'> <input type='checkbox' class=''/> ".$vals." </div>"; /* <== REMOVE EXTRA DIV */
}else{
echo "<div class='clear'><input type='checkbox'/> ".$key." </div>"; /* <== REMOVE EXTRA DIV */
}
}
//
}
}
RecursiveWrite($role, $child);
?>
you can find a working example at http://codepad.viper-7.com/507rLc

CSS / PHP / MySQL - Display results into 3 columns

I'm trying to display the results of my query into a three columns for each row returned.
The setup is 3 divs all floating left inside one large wrapper. Easy enough, yeah?
#wrapper {width: 650px;}
#left {width: 200px; float: left;}
#middle {width: 200px; float: left;}
#right {width: 200px; float: left;}
Results displayed like:
LEFT | MIDDLE | RIGHT
LEFT | MIDDLE | RIGHT
LEFT | MIDDLE | RIGHT
LEFT | MIDDLE | RIGHT
Only now, I have this mysql associative query I want to display the results of in each column.
To be simple, I have Column A that needs to be in the left div.
Columns B through Y in middle div.
Column Z in right div.
Here's my query:
while ($row = mysql_fetch_assoc($result)) {
foreach ($row as $col => $val) {
if ($col == "Column A") {
//How to get this in left div?
}
if ($col != "Column A" && $col != "Column Z") {
//How to get this in middle div?
}
if ($col == "Column Z") {
//How to get this in right div?
}
}
}
I'm really not sure where to even start.
Always try seperating the view (HTML) from the actual code. You might want to read a bit about the MVC arhitecture. It might seem hard to understand at first, but trust me - it's worth learning how to use it.
<?php
$column = array(
'A' => array(),
'B' => array(),
'Z' => array()
);
while ($row = mysql_fetch_assoc($result)) {
foreach ($row as $col => $val) {
if ($col == "Column A") {
$column['A'][] = $row;
}
if ($col != "Column A" && $col != "Column Z") {
$column['B'][] = $row;
}
if ($col == "Column Z") {
$column['Z'][] = $row;
}
}
}
?>
<style type="text/css">
div {width:200px;float:left}
</style>
<!-- 1st column -->
<div><?php foreach ($column['A'] AS $row) { ?>...<?php } ?></div>
<!-- 2nd column -->
<div>..</div>
<!-- 3rd column -->
<div>..</div>
Cheers!
You have quite many options here. But as i would do this is to make 3 or 1 array(s) then in my template iterate them in html you got there.
Something like:
$col_left = array();
$col_mid = array();
$col_right = array();
while ($row = mysql_fetch_assoc($result)) {
foreach ($row as $col => $val) {
if ($col == "Column A") {
$col_left[] = $val;
}
if ($col != "Column A" && $col != "Column Z") {
$col_mid[] = $val;
}
if ($col == "Column Z") {
$col_right[] = $val;
}
}
}
Then just in html loop those and your done. There's many more options to go, but this would be from the top of my head.
Then in html:
<div id="left">
<?php
foreach($col_left as $result){
echo $result.'<br/>';
}
?>
</div>
Something like that, ofc you can add checks for empty etc. there.
I would do it slightly autonomously, taking your current identifiers into account. I've just dumped all of the content into an array, and joined it with line breaks at the bottom. My example might be a little too general, but it certainly gets the job done, and tweaks are completely possible :)
<?
$columns = array(
'left' => array(),
'middle' => array(),
'right' => array()
);
while ($row = mysql_fetch_assoc($result)) {
foreach ($row as $col => $val) {
if ($col == "Column A") {
$columns['left'][] = $val;
} elseif ($col == "Column Z") {
$columns['right'][] = $val;
} else {
$columns['middle'][] = $val;
}
}
}
?>
<div id="wrapper">
<? foreach($columns as $column => $value_array) { ?>
<div id="<?= $column ?>">
<?= join("<br />", $value_array) ?>
</div>
<? } ?>
</div>
I did this exact thing, but I put the result into a table. I used the modulus function with a helper counter variable.
if (($artisttablecount % 3) == 0){
echo "</tr><tr>";
}
I'm not sure how to do it with the divs, but the mod function may help. Full code below.
//QUERY
$artisttable = mysql_query("SELECT DISTINCT * FROM records GROUP BY artist ORDER BY artist ASC");
//HELPER VAR FOR PRINTING IN 3 ROWS
$artisttablecount=0;
//LOOP THROUGH RESULTS
while($row = mysql_fetch_array($artisttable)){
//MAKES TABLE 3 COLUMNS
if (($artisttablecount % 3) == 0){
echo "</tr><tr>";
}
$current=$row['Artist'];
$artcount = mysql_num_rows(mysql_query("SELECT * FROM records WHERE artist = '$current'"));
$spaceless = str_replace(" ", "%20", $row['Artist']);
echo "<td><a href=inventory.php?dec=0&format=0&art='" . $spaceless . "'>" . $row['Artist'] . "</a> ($artcount)</td>";
$artisttablecount++;
}
?>

Categories