So I'm trying to set the body background tag to a php variable I created, however I can't get it to correctly work.
Here is the simple PHP:
<?php
$backGround = "images/backgrounds/grey.png";
?>
and here is the HTML I tried which none worked.
<body background="<?php echo $backGround; ?>">
<body background="<?php echo htmlspecialchars($backGround); ?>">
I found these from preview stack overflow questions but they were about setting PHP variables to image sources. I would have thought it would apply to this as well.
Here's my entire PHP page using some of the suggestions but yet to still work.
<?php
$backGround = "images/backgrounds/grey.png";
?>
<html>
<head>
<title>Exodus</title>
<link rel=StyleSheet href="styles/main.css" type="text/css" media=screen>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- Google Fonts -->
<link href='https://fonts.googleapis.com/css?family=Quicksand' rel='stylesheet' type='text/css'>
<!-- JS Scripts -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript" src="assets/fader.js"></script>
</head>
<body style= 'background-image: url("<?php echo $backGround; ?>")'>
<div class="pre-wrap">
<div id="container">
<img src="images/logo.png" id="logo" alt="Pre Logo" style="display: none; margin: 0 auto;" />
</div>
</div>
<div class="wrap">
<p>Test</p>
</div>
</div>
</body>
First of all - using backgound attribute is not recommended by W3C.
What you really need is inline style:
<body style="background-image: url('<?php echo $backGround; ?>')">
check this it will work
<body style= 'background-image: url("<?php echo $backGround; ?>")'>
<body style= 'background-image: url("<?php echo htmlspecialchars($backGround); ?>")'>
Related
Closed. This question is not reproducible or was caused by typos. It is not currently accepting answers.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Closed 6 years ago.
Improve this question
I can't see the problem with this bit of code it seems simple enough, i have a basic webpage:
<?php
include('includes/db_connection.php');
include('includes/functions.php');
include('includes/arrays.php');
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Payday Dreams</title>
<link href='http://fonts.googleapis.com/css?family=Nunito:400,300,700' rel='stylesheet' type='text/css'>
<link href="templates/css/main.css" rel="stylesheet" type="text/css" />
<link href="templates/css/bootstrap_v3.css" rel="stylesheet" type="text/css" />
<style type="text/css">
body{background:url(templates/images/bg_sub.png) repeat-x;}
</style>
<script type="text/javascript" src="templates/js/jquery.js"></script>
<script type="text/javascript" src="templates/js/bootstrap.js"></script>
<script type="text/javascript" src="templates/js/json2.js"></script>
<script type="text/javascript" src="templates/js/common.js"></script>
<script type="text/javascript" src="templates/js/ajax.js"></script>
</head>
<body style="background:#cfe4ee;">
<div style="height:100px; background:#000;">
<div style="width:971px; margin:0 auto; color:#ffffff; font-size:13px;">
<div style="text-align:center; padding-top:10px; font-size:16px; font-weight:bold; font-family:Arial"> <img src="templates/images/small_lock.png" alt="" style="vertical-align:middle" /> Unlock this page to continue!
<br />
<p class="link_ins">TEST</p>
<div id="_ostatus" style="color:#ffffff; font-size:14px; font-weight:normal"> </div>
</div>
</div>
</div>
<div id="linklocker_wrapper">
<div id="contents" style="margin-top:100px;">
<div class="jumbotron">
<div id="offersSection2" style="height:250px; width:570px; margin:25px auto" >
<!-- offer box -->
<div class="offerp_box3" >
<div class="mid" style="height:220px">
<div id="_offers">
<table class="table table-hover table-bordered table-condensed" style="width:530px; background:#ffffff; border:1px solid #cccccc;">
<?php
// get offers from the database
$rows = DB::getInstance()->select('SELECT * FROM `offers` ORDER BY RAND() LIMIT 5');
?>
<?php foreach ($rows as $row) { ?>
<?php
print_r($_GET);
$p = $_GET['p'];
echo $p;
?>
<tr >
<td class="offerDiv" title="<?php echo $row['offer_title']; ?>" style="height:30px; vertical-align:middle">
<div><img src="templates/images/chk.png" alt="" /> <?php echo $row['offer_title']; ?></div>
</td>
</tr>
<?php } ?>
</table>
</div>
</div>
</div>
<div id="dform" style="display:none; width:90%; text-align:center">
</form>
</div>
</div>
</div>
The URL is like this: http://www.site.co.uk/page.php?l=1p=7 what i'm trying to do is get the value of $_GET['p'] and use it within the foreach loop, when i try to print the value out within the loop it's blank but shows fine before it enters the loop, i have racked the brains i can't think of an alternate way of getting that value, any help would be appreciated.
Is your URL correct at your guess? Believably, what you are trying to do is: http://www.site.co.uk/page.php?l=1&p=7 Notice the & in the URL. You had: http://www.site.co.uk/page.php?l=1p=7. Was that intentional?
In your URL, the two query string parameters need to be separated by &. It's unable to recognize what p is.
http://www.site.co.uk/page.php?l=1&p=7
I have created PHP files which accept data from $_GET method.
After that I use all the data I get to create HTML pages. Nothing is wrong with the data but in CSS I cannot style HTML elements. Except when it comes to inline styling, that works but it is not good to maintain.
I try to use like this but it doesn't work , Please Help
THANK IN ADVANCE
Example.php
<?php
$dataCover = $_GET['dataCover'];
$dataTitle = $_GET['dataTitle'];
$dataTag = $_GET['dataTag'];
$dataDir = $_GET['dataDir'];
$dataYear = $_GET['dataYear'];
$dataCreated = $_GET['dataCreated'];
$dataModified = $_GET['dataModified'];
$userAUID = $_GET['userAUID'];
$galleryID = $_GET['galleryID'];
?>
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css" media="all">
#container img{
height: 230px;
width: 200px;
}
#container .center{
display: block;
margin: 0 auto;
}
</style>
<script src="../lib/jquery-1.10.2.min.js"></script>
<script src="../lib/jquery.mobile-1.3.1.min.js"></script>
<script src="../lib/se.js"></script>
</head>
<body>
<div data-role ="page" id ="page1">
<div data-role ="header">
<h1> header </h1>
</div>
<div data-role="content">
<div id="container">
<img class="center" src="<?echo $dataCover?>" alt=""/>
<p id="title"><?echo $dataTitle;?></p>
<p id="tag"><?echo $dataTag;?></p>
<p id="created">Created : <?echo $dataCreated?></p>
<p id="modified">modified : <?echo $dataModified?></p>
View Ebook-Gallery
Bookmark
</div>
</div>
</div>
</body>
</html>
When you move your css from inline to style sheet file, you have to refresh your page with Ctrl+F5. Maybe it's coming from the cache.
Also you can assign your css to the image by jquery.
I dont see any reference to any external stylesheet, so it seems like you have forgotten to do this.
Put this line
<link rel="stylesheet" type="text/css" href="/css/style.css" />
Somewhere in the head. Maybe before the script tags.
Make sure you adjust the path to your stylesheet.
Yes When you want to apply external css you have to give the path after the <title> tags within the <head> tags .just follow the html code
<!DOCTYPE html>
<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="css/style.css" />
<!--Here css is the folder name where you have keep the style.css file -->
<script src="../lib/jquery-1.10.2.min.js"></script>
<script src="../lib/jquery.mobile-1.3.1.min.js"></script>
<script src="../lib/se.js"></script>
</head>
I wonder whether someone may be able to help me please.
Firstly I apologise for what most may feel is a really simple question. But this is my first attempt so please bear with me.
I'm using the script below to create an Image Gallery with Fancybox.
UPDATED CODE
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Gallery</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="fancybox/jquery.fancybox-1.3.4.pack.js"></script>
<script type="text/javascript" src="fancybox/jquery.easing-1.4.pack.js"></script>
<script type="text/javascript" src="fancybox/jquery.easing-1.4.pack.js"></script>
<script type="text/javascript" src="fancybox/jquery.mousewheel-3.0.4.pack.js"></script>
<script type="text/javascript" src="fancybox/source/helpers/jquery.fancybox-buttons.js?v=1.0.2"></script>
<script type="text/javascript" src="fancybox/source/helpers/jquery.fancybox-media.js?v=1.0.0"></script>
<script type="text/javascript" src="/fancybox/source/helpers/jquery.fancybox-thumbs.js?v=2.0.6"></script>
<link rel="stylesheet" href="fancybox/source/helpers/jquery.fancybox-buttons.css?v=1.0.2" type="text/css" media="screen" />
<link rel="stylesheet" href="fancybox/jquery.fancybox-1.3.4.css" type="text/css" media="screen" />
<link rel="stylesheet" href="fancybox/source/helpers/jquery.fancybox-thumbs.css?v=2.0.6" type="text/css" media="screen" />
<script type="text/javascript">
$(document).ready(function() {
$("a.fancybox-thumb").fancybox({
'transitionIn' : 'elastic',
'transitionOut' : 'elastic',
'speedIn' : 600,
'speedOut' : 200,
'overlayShow' : false
});
});
</script>
</head>
<body style="font-family: Calibri; color: #505050; font-size: 9px; border-bottom-width: thin; margin-top: 5px; margin-left: 100px; margin-right: 100px; margin-bottom: -10px; float: left; position: absolute;">
<div align="right" class="style1"> <a href = "javascript:document.gallery.submit()"/> Add Images <a/> ← View Uploaded Images </div>
<form id="gallery" name="gallery" class="page" action="index.php" method="post">
<?php for ($i = 0; $i < $descriptions->documentElement->childNodes->length; $i++) :
$xmlFile = $descriptions->documentElement->childNodes->item($i);
$name = htmlentities($xmlFile->getAttribute('originalname'), ENT_COMPAT, 'UTF-8');
$description = htmlentities($xmlFile->getAttribute('description'), ENT_COMPAT, 'UTF-8');
$source = $galleryPath . rawurlencode($xmlFile->getAttribute('source'));
$thumbnail = $thumbnailsPath . rawurlencode($xmlFile->getAttribute('thumbnail'));
?>
<a class="fancybox-thumb" rel="allimages" href="<?php echo $source; ?>"><img src="<?php echo $thumbnail; ?>" alt="<?php echo $name; ?>"/></a><?php endfor; ?>
</form>
</body>
</html>
I can view the images, but I just can't seem to get the gallery functionality working. I've been working through the examples on the 'fancyBox' and 'fancyApps'websites, but clearly I've misunderstood something along the way.
I feel that once I get started I can format the page as I need it to look, I'll just working through the tutorials. But I just wondered if someone could perhaps please show me where I've gone wrong in creating the initial gallery.
Many thanks and regards
I're attaching your fancybox to a class called ".fancybox-thumb", yet there is no such class on the page. Instead, your links bear class called ".images"
So try replacing this line
<a class="images" rel="allimages" href="<?php echo $source; ?>"><img src="<?php echo $thumbnail; ?>" alt="<?php echo $name; ?>"/></a><?php endfor; ?>
with
<a class="fancybox-thumb" rel="allimages" href="<?php echo $source; ?>"><img src="<?php echo $thumbnail; ?>" alt="<?php echo $name; ?>"/></a><?php endfor; ?>
I haven't tested your code but that's one obvious mistake I found so far.
After the initial issues raised by #kernelpanic, #ryan and #Mr_DeLeTeD were rectified, through further testing and having looked through the documenation, the 'grey vertical stripe' was the opacity setting and not an error.
I wonder whether someone may be able to help me please.
I'm using Aurigma's 'Image Uploader' software to allow users to add, and view images for the records they create with the image data collected and retrieved via an XML file.
One of the pages I've put together creates a gallery which allows the user to view the images, both individually and as part of a 'fancybox' slideshow. The script for this is shown below.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<?php
$galleryPath = 'UploadedFiles/';
$thumbnailsPath = $galleryPath . 'Thumbnails/';
$absGalleryPath = realpath($galleryPath) . DIRECTORY_SEPARATOR;
$descriptions = new DOMDocument('1.0');
$descriptions->load($absGalleryPath . 'files.xml');
?>
<head>
<title>Gallery</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link href="Libraries/fancybox/jquery.fancybox-1.3.1.css" rel="stylesheet" type="text/css" />
<link href="Styles/style.css" rel="stylesheet" type="text/css" />
<!--[if IE]>
<link href="Styles/ie.css" rel="stylesheet" type="text/css" />
<![endif]-->
<script src="Libraries/jquery/jquery-1.4.3.min.js" type="text/javascript"></script>
<script src="Libraries/fancybox/jquery.fancybox-1.3.1.pack.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() { $('a.fancybox').fancybox(); });
</script>
<style type="text/css">
<!--
.style1 {
font-size: 14px;
margin-right: 110px;
}
.style4 {font-size: 12px}
-->
</style>
</head>
<body style="font-family: Calibri; color: #505050; font-size: 9px; border-bottom-width: thin; margin-top: 5px; margin-left: -475px; margin-right: 1px; margin-bottom: -10px;">
<div align="right" class="style1"> <a href = "imagefolders.php" /> View Uploaded Images In Folder Structure <a/> ← View All Uploaded Images </div>
<form id="gallery" class="page">
<div id="container">
<div id="center">
<div class="aB">
<div class="aB-B">
<?php if ('Uploaded files' != $current['title']) :?>
<?php endif;?>
<div class="demo">
<div class="inner">
<div class="container">
<div class="gallery">
<ul class="gallery-image-list">
<?php for ($i = 0; $i < $descriptions->documentElement->childNodes->length; $i++) :
$xmlFile = $descriptions->documentElement->childNodes->item($i);
$name = htmlentities($xmlFile->getAttribute('originalname'), ENT_COMPAT, 'UTF-8');
$description = htmlentities($xmlFile->getAttribute('description'), ENT_COMPAT, 'UTF-8');
$folder = htmlentities($xmlFile->getAttribute('folder'), ENT_COMPAT, 'UTF-8');
$source = $galleryPath . rawurlencode($xmlFile->getAttribute('source'));
$thumbnail = $thumbnailsPath . rawurlencode($xmlFile->getAttribute('thumbnail'));
?>
<li class="item">
<a class="fancybox" target="_blank" rel="original" href="<?php echo $source; ?>"><img class="preview"
alt="<?php echo $name; ?>" src="<?php echo $thumbnail; ?>" /></a> </li>
<li class="item"></li>
<p><span class="style4"><b>Image Description:</b> <?php echo htmlentities($xmlFile->getAttribute('description'));?> <br />
<b>Image contained in folder:</b> <?php echo htmlentities($xmlFile->getAttribute('folder'));?> </span><br />
<?php endfor; ?>
</li>
</p>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="aB-a"> </div>
</div>
</div>
</div>
</form>
</body>
</html>
What I'd like to be able to do is now make the images that are retrieved, user specific, i.e. User A can only view their images.
If this information was being retrieved straight from a mySQL database I know that within PHP I can use the 'SELECT WHERE' statement to filter the returned records, but could someone tell me please is there an XML equivalent that I could use?
Many thanks
Allowing users to view only their own uploaded images is not such a simple task. If the images are stored in a publically accessable folder then anybody can view the images using their browser.
To achieve this there are a few alternatives such as:
storing the images in the database rather than the filesystem,
creating a new foler for each user on the filesystem and changing
the read write permissions for each folder, or
storing the images outside the web root and fetching the images
using php i.e.
Instead of providing a link to an image. Provide a link to a cgi
script which will automatically provide the proper header and
content of the image.
For example: image.php?sample.jpg
You can then make sure they are already authenticated (e.g. pass a
session id) as part of the link.
This would be part of the header, and then your image data can
follow.
<?php
$file = basename(urldecode($_GET['file']));
$fileDir = '/path/to/files/';
if (file_exists($fileDir . $file))
{
//perform some authorisation check
...
...
// Note: You should probably do some more checks
// on the filetype, size, etc.
$contents = file_get_contents($fileDir . $file);
// Note: You should probably implement some kind
// of check on filetype
header('Content-type: image/jpeg');
echo $contents;
}
?>
I would like to kindly ask you to help me understand how does the view part "see" the layout part in the zend framework.
In my way of thinking(and I'm thinking like a noob) there should be a root that directs the view (index.phtml) to the layout (designer.phtml) right?
Below is not my code, I'm just trying to make sense of it.
This is the view part of the code, the root of the file is /applications/xampp/xamppfiles/htdocs/mts/applications/modules/designer/views/scripts/index/ index.phtml
<div style="width:100%; margin-bottom:20px; margin-top:5px;">
<span style="padding-left:10px; font-size:18px;">Designer <img alt="(?)" src="/style/images/help-8.png"/></span>
</div>
<?= $this->leftmenu; ?>
<div id="picFrame" style="text-align: center"></div>
<div id="middle_admin_content">
<fieldset>
<legend id="bookTitleLegend">Please select a book first</legend>
<div id="fileBox"><div id="innerBox"></div></div>
<div id="uploadSuccess" class="statusBox" style="display: none; background-color: #D9F5CB"><span>File Uploaded Successfully</span></div>
<div id="uploadFailed" class="statusBox" style="display: none; background-color: #EBB9B9"><span>File Upload Failed</span></div>
<div id="aboutTheBook" style="display: none">
<form id="aboutTheBookForm" action="" method="post">
<textarea name="about_the_book" id="about_the_book" cols="60" rows="10"></textarea>
<input type="submit" value="Save Text" name="saveCoverText"/>
<input type="hidden" value="" name="bookid" id="bookidField"/>
</form>
</div>
</fieldset>
</div>
This is the layout part of the code, the root of the file is
/applications/xampp/xamppfiles/htdocs/mts/applications/layouts/scripts/designer.phtml
<?php echo $this->doctype() ?>
<html>
<head>
<title>InTech - Design</title>
<?php
echo $this->headTitle() . "\n";
echo $this->headMeta() . "\n";
?>
<?
echo $this->headStyle() . "\n";
echo $this->headLink() . "\n";
echo $this->headScript(). "\n";
?>
<?
/*
$jsContainer = $this->Minify_Container();
$jsContainer->appendFile('/js/jquery-1.4.2.min.js');
$jsContainer->appendFile('/js/jquery-ui-1.8.2.custom.min.js');
$jsContainer->appendFile('/js/jquery.autocomplete.js');
$jsContainer->appendFile('/js/jquery.bgiframe.min.js');
$jsContainer->appendFile('/js/jquery.idTabs.min.js');
$jsContainer->appendFile('/js/jquery/jquery.form.js');
$jsContainer->appendFile('/js/uploadify/jquery.uploadify.v2.1.4.min.js');
$jsContainer->appendFile('/js/designer/designer.js');
$jsContainer->appendFile('/js/scrollpane/jquery.jscrollpane.min.js');
$jsContainer->appendFile('/js/scrollpane/jquery.mousewheel.js');
echo $this->Minify($jsContainer, 'js');
$cssContainer = $this->Minify_Container();
$cssContainer->appendStylesheet('style/ui.all.css');
$cssContainer->appendStylesheet('js/jquery-ui-1.8.2.custom.css');
$cssContainer->appendStylesheet('style/site_css/designer_style.css');
$cssContainer->appendStylesheet('js/scrollpane/jquery.jscrollpane.css');
echo $this->Minify($this->headLink(), 'css');
echo $this->Minify($cssContainer, 'css');
*
*/
?>
<!-- MINIFIED ABOVE ------------------------->
<link rel="shortcut icon" href="/style/site_images/favicon.ico" type="image/x-icon" />
<link type="text/css" href="/style/ui.all.css" rel="stylesheet" />
<link type="text/css" href="/js/jquery-ui-1.8.2.custom.css" rel="stylesheet" />
<link type="text/css" href="/style/site_css/designer_style.css" rel="stylesheet" />
<link type="text/css" href="/js/scrollpane/jquery.jscrollpane.css" rel="stylesheet" />
<!--<script type="text/javascript" src="/js/jquery-1.4.2.min.js"></script>-->
<script type="text/javascript" src="/assets/modules/manager/basic/js/jquery-1.5.2.min.js"></script>
<script type="text/javascript" src="/assets/modules/manager/basic/js/plugins/jquery.form.js"></script>
<script type="text/javascript" src="/js/jquery-ui-1.8.2.custom.min.js"></script>
<script type="text/javascript" src="/js/jquery.autocomplete.js"></script>
<script type="text/javascript" src="/js/jquery.bgiframe.min.js"></script>
<script type="text/javascript" src="/js/jquery.idTabs.min.js"></script>
<!--<script type="text/javascript" src="/js/jquery/jquery.form.js"></script>-->
<script type="text/javascript" src="/js/uploadify/jquery.uploadify.v2.1.4.min.js"></script>
<script type="text/javascript" src="/js/designer/designer.js"></script>
<script type="text/javascript" src="/js/scrollpane/jquery.jscrollpane.min.js"></script>
<script type="text/javascript" src="/js/scrollpane/jquery.mousewheel.js"></script>
<!-- -->
</head>
<body>
<div id="dialog" style="display:none; font-size:12px; background-color:#ffffff;">
<div id="dialog_left" style="float:left; width:150px">
</div>
<div id="dialog_right">
</div>
</div>
<div id="dialogDelete" style="display: none">Delete Item?</div>
<!-- HEADER SITE AREA :: START -->
<div id="header">
<?php
$front = Zend_Controller_Front::getInstance();
$module = $front->getRequest()->getModuleName();
echo $this->render('header-designer.phtml', array(
'authenticated' => $this->authenticated
));
?>
</div>
<!-- HEADER SITE AREA :: END -->
<!-- CONTENT :: START -->
<div id="contentAdmin">
<div id="helpDialog" style="display: none"></div>
<?php echo $this->layout()->content ?>
</div>
<!-- CONTENT :: END -->
<!-- FOOTER SITE AREA :: START -->
<div id="footer">
<?php echo $this->render('footer.phtml', array(
'authenticated' => $this->authenticated
)) ?>
</div>
<!-- FOOTER SITE AREA :: START -->
</body>
</html>
The specific mechanics of how all this implemented involves bootstrapping application resources and registering late-running front-controller plugins.
But the short answer is the "system" knows how to find/render the view-script associated to the requested action and how to find/render your layout script with the view-script content injected.
Remember, at some point, you bootstrapped a Layout resource, probably in configs/application.ini.
You also bootstrapped a View resource - either explicitly or implicitly - which knows how to render your headTitle(), headMeta(), headScript(), etc (all rendered using view-helpers), as well as the layout.
So, there's really no mystery that the "system" is aware of all this stuff.