I'm currently building a website using PHP and using Apache for the web server. I recently added some sub-folders to my images folder and am trying to load in those images on the site. However, the images aren't loading, and when I view the sources tab in DevTools, I'm seeing that it's not even loading in the new folders I've added, as well as some test images I've tried adding in. It had no issues with the initial dump of files I gave it, but won't load any new folders/images:
Images directory with new folders
Sources tab only loading original image files
Below is the PHP code that loads images onto the page:
<?php
$newsSql = "SELECT newsID, newsTitle, newsDescription, newsPicturePath, newsPicAlt, newsURL, newsBtnText FROM news_items ORDER BY newsID DESC";
$newsResult = $conn->query($newsSql);
if ($newsResult->num_rows > 0) {
while($row = $newsResult->fetch_assoc()) {
echo '<div class="row justify-content-center">';
echo ' <div class="card contentC">';
echo ' <img src="' . $row["newsPicturePath"] .'" class="card-img-top" alt="' . $row["newsPicAlt"] .'">';
echo ' <div class="card-body">';
echo ' <h5 class="card-title">' . $row["newsTitle"] .'</h5>';
echo ' <p class="card-text cardC">' . $row["newsDescription"] .'</p>';
echo ' ' . $row["newsBtnText"] .'';
echo ' </div>';
echo ' </div>';
echo '</div>';
}
}
?>
It's definitely going to be something simple and stupid but I cannot figure it out for the life of me.
There was nothing wrong with my Apache environment or my code; was victim to commas instead of periods in strings I was passing for image paths.
Called it that it was something stupid.
Related
I have Images stored in my DB, I want to retrieve them all and display them in the browser. It works just fine, but I want to give the user the ability to click on the picture so that they can have a better view of the picture (so display it with its original size). I tried many things but didn't work. second question: if I want my code to support multiple images type (such gif, jpg, etc..), if there a way to do it without having to save the image type (when I insert the images) and play with a whole bunch of if/else (when I retrieve them)?
This is my code
$count = 0;
echo " <div class=\"row\">";
while($row = $result->fetch_assoc()) {
$imagename = base64_encode( $row['Image'] );
if(($count%3) ==0){
echo "</div>";
echo " <div class=\"row\">";
echo " <div class=\"col-sm-2\">";
echo " <a href=\"$imagename.jpeg\" class=\"thumbnail\">";
echo '<img src="data:image/jpeg;base64,'.base64_encode( $row['Image'] ).'" style=\"width:130px;height:130px\"/>';
echo"</a></div>";
++$count;
}else{
echo " <div class=\"col-sm-2\">";
echo " <a href=\"$imagename.jpeg\" class=\"thumbnail\">";
echo '<img src="data:image/jpeg;base64,'.base64_encode( $row['Image'] ).'" style=\"width:130px;height:130px\"/>';
echo"</a></div>";
++$count;
}
}
echo "</div>" ;
The answer to your first question is "You have to use light-box jQuery plugin", in order to display larger (original size) of a thumbnail you need to use any lightbox plugin, I recommend using this one
http://www.jqueryscript.net/zoom/Responsive-jQuery-Lightbox-Like-Image-Zooming-Plugin-Lighter.html
Or you can search for any other plugin, there are thousands of them.
Regarding your second question, If you will use data as an images source, you have to specify a type, no way you can do that without mentioning types.
So I am using the code that I got off W3C here: http://www.w3schools.com/php/php_ajax_database.asp
modified it to fit with my file names and database etc, however I am having a weird issue with echoing my responses to look correct.
For every product that collects from the product database it needs to print it in a section tag like so:
while($row = $result->fetch_assoc())
{
echo "<section class='sideWays'>" . $row['product_ID'] . " " . $row['product_name'] . " " . $row['description'] . " " . "<div class='colHeaderImageRight'>" . '<img src="'.$row['image'].'"">' . "</div>" . "</section>";
}
However this code isn't working anymore, the closest I have gotten is it to only display one and then breaks the rest.
the PHP echo is being returned into the following div tag
<article>
<div id="txtHint"><b>Person info will be listed here...</b></div>
</article>
so I have tried changing my CSS to stuff like article > .txtHint > #sideWays or even just making the #sideWays css the same as .txtHint to skip the > #sideWays but nothing is working to display my CSS on the echo.
I'm not sure why but changing the keyword echo to print fixed the issue of it not recognising my html tags and applying the CSS to them.
I am working on a project that allows users to search Flickr and select certain images from the list of results which can then be viewed in a gallery. I'll write out the process that I have created so far and explain where I am stuck.
The index page is just a search bar and a submit button.
The user types in a search term and hits submit where the form action is action=flickrcall.php
flickrcall.php does this:
<?php
require_once('flickr.php');
$Flickr = new Flickr;
$data = $Flickr->search($_POST["search"]);
foreach($data['photos']['photo'] as $photo) {
echo '<img class="large" onclick="select(this)" src="' . 'http://farm' . $photo["farm"] . '.static.flickr.com/' . $photo["server"] . '/' . $photo["id"] . '_' . $photo["secret"] . '.jpg">';
}
?>
This will generate a list of image results up to whatever number I specify, right now it is 10. The outcome then is 10 of these:
<img class="large" id="test" onclick="select(this)" src="flickr.img.url.jpg" />
What I want to do is wrap the first <img> with then wrap the second <img> with and so on. (this is so I can use a CSS lightbox effect on the images later)
I think the way to do it is somehow create a variable (lets call it $hrefNumber) which will count up to however many results there are and use that variable like this in the echo statement above:
echo '<a href="#img' . $hrefNumber . '">
<img class="large" onclick="select(this)" src="' . 'http://farm' . $photo["farm"] . '.static.flickr.com/' . $photo["server"] . '/' . $photo["id"] . '_' . $photo["secret"] . '.jpg">'
</a>
;
The problem is that I do now know how to create such a variable nor where to declare/write it.
Does this make sense? Does it sound like I am on the right track or am I way off?
$counter=0;
foreach($data['photos']['photo'] as $photo) {
$counter++;
echo '';
}
or
foreach($data['photos']['photo'] as $counter => $photo) {
echo '';
}
I am making options in the 'customization api' for Wordpress. However for things such as the logo image, if no image has been uploaded (default value is blank) i want it to display the title of the Wordpress site. I have searched google a lot, but I just cant seem to get it to work.
I know the PHP code for the Wordpress site title, but I can't get the php 'if' and 'else' to work.
current code:
<img src="<?php echo get_theme_mod('logo_image'); ?>" alt="<?php bloginfo('name'); ?>"/>
..obviously this is just the option to upload the image, which WORKS, but I want it to display the site title if the default value is empty.
Thank you!
I don't know how you are setting the theme mod. I.e. are you using 'set_theme_mod' ?
But assuming you are complying to WordPress standards the code snippet below should be what you are seeking.
if (!empty(get_theme_mod('logo_image'))) {
echo "<img src='" . get_theme_mod('logo_image') . "' title='" . bloginfo('name') ."'>"
} else {
echo "<h2>" . bloginfo('name') . "</h2>";
}
Hope this helps you out,
Dave.
Can you try this?
<img src="<?php if (!isset(get_theme_mod['logo_image'])) {
echo ('Your custom image');
}
else{
echo get_theme_mod('logo_image');
}
?>" alt="<?php bloginfo('name'); ?
>"/>
I apologise for the potentially nebulous title, but I hope that the question will clarify why I've called it that.
I've gotten into webdev from UI design/dev so I'm finding the programming and design aspects fairly easy to handle. However, I'm not used to using three/four different languages with a fair amount of overlap to do a single thing.
In this case, I've written up a PHP script to pull the latest $n tweets from $x user. Currently I'm loading the Twitter PHP via jQuery, crafting the HTML for the tweet in PHP, echoing in the PHP, this is then plopped into a timeline element in the jQuery's callback function.
This way of doing it seems a bit hacky? I was just hoping someone would be able to point me towards another way, or at least waylay my concerns regarding this method.
Here's some Code:
HTML:
<section id="twitterContainer">
<section id="glitchTimeline" class="timeline">
<!--Twitter articles go here-->
</section>
</section>
Javascript:
function getTweets(n,user)
{
//This is run when the page is loaded
//Will be changing this to an ajax call later, aware that it's a bit silly as is.
$('<article class="twitterPost">').load("http://xxxxxxxxx.com/php/index.php?user="+user+"&count="+n, function(data){
$(this).appendTo("#glitchTimeline");
});
}
PHP:
(This is called once the twitter API stuff has come back)
function craftTweet($jsonStr)
{
$json = json_decode($jsonStr);
for($i = 0; $i<count($json); $i++)
{
echo '<img class="twitterAvatar" src=' . $json[$i]->user->profile_image_url .' alt=' . $json[$i]->user->screen_name .' width="48">';
echo '<div class="tweetText">';
echo ' <b>' . $json[$i]->user->screen_name .'</b><span>#' . $json[$i]->user->screen_name . '</span><span> </span>';
echo ' <p>' . $json[$i]->text . '</p>';
echo ' <img class="twitterIconFav" src="img/utils/transBackground.png">';
echo ' <img class="twitterIconRetweet" src="img/utils/transBackground.png">';
echo ' <img class="twitterIconReply" src="img/utils/transBackground.png">';
echo ' <div class="clearfix"> </div>';
echo '</div>';
}
}