Wordpress single page - split images & text into columns - php

I admire this wordpress single (post, permalink) page, where the content is divided into two columns, the images are on the left and the text and comments are on the right. Does anyone know how I can replicate this within a wordpress theme? How would you make a post like this?

if you can edit your theme, add a magic word that you put between the columns, for example "#NEW_COLUMN#" and before you print the post in the template file, split the columns whit
$columns = explode("#NEW_COLUMN#", $content);
if(count($columns) == 1)
{
/* print a single column page */
echo $content;
}
else if(count($columns) == 2)
{
/* print a two column page */
echo "<div class='left_column'>";
echo $columns[0];
echo "</div>";
echo "<div class='right_column'>";
echo $columns[1];
echo "</div>";
}
else
{
/* ops we can't handle this many columns */
echo $content;
}
add then you need some css to make the columns end up beside each other

add_shortcode('divider', 'shortcode_divider');
function shortcode_divider(){
return '</div><div class="column">';
}
All you need to do now is add [divider] within the post;

Related

I cant seem to be able to display my images in the slider.(Processwire)But all my fields in the repeater are properly set

<section class="hero-slider style1">
<div class="home-slider">
<!-- Single Slider -->
<?php
foreach ($page->slider_repeater as $slider_repeater) {
echo "<div class='single-slider' style='background-image:url('{$slider_repeater->images->url}{$slider_repeater->images}')'>";
echo "<div class='container'>";
echo "<div class='row'>";
echo "<div class='col-lg-12 col-md-12 col-12'>";
echo "<div class='welcome-text'>";
echo "<div class='hero-text'>";
echo "<h4>{$slider_repeater->texth4}</h4>";
echo "<h1>{$slider_repeater->texth1}</h1>";
echo "<div class='p-text'>";
echo "<p>{$slider_repeater->textp}</p>";
echo "</div>";
echo "</div>";
echo "</div>";
echo "</div>";
echo "</div>";
echo "</div>";
echo "</div>";
}
?>
</div>
</section>
The section on background image seems to be the problem, all the other text is working well in the site but the images.
First you need to check if your field is set to single-value or multi-value output. In the backup, go to Setup -> fields -> images and check the Details tab. Take note of the Maximum files allowed and Formatted value settings. Those will tell you whether your images field contains a single image or multiple images.
There's also multiple things going wrong inside your background-image:url function: style='background-image:url('{$slider_repeater->images->url}{$slider_repeater->images}')'
You're using single quotes (') both to delimit the start and end of your HTML attribute value AND inside the url function, this might cause errors. Leave out the single quotes inside the url function.
What's the purpose of the second {$slider_repeater->images} call? Leave that out.
All that said, change your style parameter to one of the following and it should work:
// if your images field is set to Single item, or Automatic with a limit of 1
style='background-image:url({$slider_repeater->images->url})'
// if your images field is set to Arry of items, or Automatic with a limit of 0 or >1
style='background-image:url({$slider_repeater->images->first->url})'

Limit content inside the div by its size

I'm dynamically filling a table of content fetch from the database.
This table is inside a <div>
So I'm setting a variable $col to limit how much columns I want each row (by default I saw 5 fit perfectly) in the div. Otherwise the table content just goes outside the div.
The problem is I had to set that manually. I looked around a lot how to make any content inside div and once it colides with the border but couldn't find anything. If I could have the same result without using tables which are the problem I think . I'll be glad to update that.
$col = 1; //initialisation
foreach ($result as $product){ //a loop to fetch data into product object
if($product->visible == 1){
if($Col < 6){
echo "<td>";
echo "<a href ='read.php?id=".$product->id_product."&p=0'><div class='productdiv'>";
echo "<img src ='galleries/".$product->id_product."/c".$product->id_product.".jpg' alt = 'cover' width='220' height='300'><h4 class='productclass'>".$product->name_product."</h4>";
echo "</div></a>";
echo "</td>";
$col= $col+ 1; //here I'm incrementing
}
else{ //I close the line <tr> then another line begin
echo "</tr><tr><td>";
echo "<a href ='read.php?id=".$product->id_hentai."&p=0'><div class='hendiv'>";
echo "<img src ='galleries/".$product->id_product."/c".$product->id_product.".jpg' alt = 'cover' width='220' height='300'><h4 class='productclass'>".$product->name_product."</h4>";
echo "</div></a>";
echo "</td>";
$col= 1;
}//end the code
result
Please use
display: inline-block
It will accommodate the content. And where you have open the <tr> in "if" condition.
Not fully sure I understood your question but this sounds like a job for JS
1 You should read all possible columns from db and create table from them but set visibility to hidden.
2 Then add JS and define column priorities.
3 Get maximum allowed width for table.
4 Using JS read width of all you cells
5 By priority sum your cell width until it's > max width
6 hide cells with lesser priority that can't fit

Wordpress PHP multiple else statements

I am making a wordpress theme and i want to have some of the page templates with an extended header div tag so i can add extra things in.
This is the code i have:
<?php if (!is_page_template('page-homepage.php')) { echo "</div>"; } ?>
I want it so i can have alternatives to the page-homepage.php so for example page-team.php as i want that individual page template to not close the div yet either, i tried writing this but it just does every page:
<?php if (!is_page_template('page-homepage.php' or 'page-team.php')) { echo "</div>"; } ?>
Any ideas? My php skills are not very advanced!
thanks :D
You are making a logical operation on two strings ('page-homepage.php' or 'page-team.php') which evaluates to true, so the statement becomes:
<?php if (!is_page_template(true)) { echo "</div>"; } ?>
Try this instead:
<?php if (!is_page_template('page-homepage.php') && !is_page_template('page-team.php')) { echo "</div>"; } ?>

IFstatement in MySQL query

I want to write something like this :
<?php
$comment = mysql_query("SELECT * FROM `communication` WHERE `ID`='$index' order by `Date_add` desc");
echo "<div class=\"row\">";
while ($com = mysql_fetch_assoc($comment)) {
$side = mysql_query("SELECT Type FROM `client` WHERE `ID`='$comtype'");
if ($side[0]==2) {
echo "<div class=\"left\">"; // and i want to execute this line only when the next value of $side is equal to 1 or 9
echo "<div class=\"inside1\">"
...
echo "</div>";
echo "</div>"; // same as above, close div only, when the next value of $side is equal to 1 or 9
} else if ($side[0]==1 || $side[0]==9) {
echo "<div class=\"right\">"; // Same here i want to execute this line only when the next value of $side is equal to 2
echo "<div class=\"inside2\">";
...
echo "</div>";
echo "</div>"; // same as above, close div only, when the next value of $side is equal to 2
}
}
echo "</div>";
I need to execute whole code, but i have div inside div, and i want and execute when value of $side[0] is different. For example:
Loop step 1:
$side[0]=2
so i want to execute: <div class=left> and everything in this div.
Loop step 2:
$side[0]=2 again
so i want to execute all in <div class=left> but i dont want to create another <div class=left>
Lopp step 3:
$side[0]=1
so previously $side[0] was equal 2, so now i want to create <div class=left> and everything in this div
Lopp step 4:
$side[0]=1 again
so i want to execute all in <div class=right> but i dont want to create another <div class=right>
etc...
Anyone know how to achive effect like this ? Thanks for help in advice.
Understanding your problem, you have two main din inside your while loop and inside those div you want to display result according to a particular column value. The way I can suggest you make to separate array based on the value from query. Then iterate through individual array and display it on the let/right div accordingly.

Using PHP, within a search, how do I contain an html link in an image from my MySql database?

This is my problem: I have an ecommerce website, and I would like my search results to come up with products that have their links avaiable either within the image of the product on the search page, or next to the image. My current code looks like this:
if($_GET['searchBox'] !='')
{
if(mysql_num_rows($searchresult)==0) {
echo 'Your search returned no results';
}
else
{
while ($row = mysql_fetch_assoc($searchresult))]
{
echo "<img src='".$row['image']."'/>".' '.$row['name'].' £'.$row['price'].' '.$row['ProductUrl'];
}
}
}
?>
I have spent ages trying to get an URL into the image area, but I can't make it work.
Please help!!
What the problem put image in to the anchor tag.
Have you tried like this
echo "<a href='".$row['ProductUrl']."'><img src='".$row['image']."'/></a>";
EDIT
echo "<img src='".$row['image']."'/>".' '.$row['name'].' £'.$row['price'].'
<a href="'.$row['ProductUrl']."'>".$row['ProductUrl']."</a>";

Categories