So, I'm working on a site where on the top of certain pages I'd like to display a static graphic and on some pages I would like to display an scrolling banner.
So far I set up the condition as follows:
<?php
$regBanner = true;
$regBannerURL = get_bloginfo('stylesheet_directory'); //grabbing WP site URL
?>
and in my markup:
<div id="banner">
<?php
if ($regBanner) {
echo "<img src='" . $regBannerURL . "/style/images/main_site/home_page/mock_banner.jpg' />";
}
else {
echo 'Slider!';
}
?>
</div><!-- end banner -->
In my else statement, where I'm echoing 'Slider!' I would like to output the markup for my slider:
<div id="slider">
<img src="<?php bloginfo('stylesheet_directory') ?>/style/images/main_site/banners/services_banners/1.jpg" alt="" />
<img src="<?php bloginfo('stylesheet_directory') ?>/style/images/main_site/banners/services_banners/2.jpg" alt="" />
<img src="<?php bloginfo('stylesheet_directory') ?>/style/images/main_site/banners/services_banners/3.jpg" alt="" />
.............
</div>
My question is how can I throw the div and all those images into my else echo statement? I'm having trouble escaping the quotes and my slider markup isn't rendering.
<div id="banner">
<?php if($regbanner): ?>
<img src="<?php echo $regBannerURL; ?>/style/images/main_site/home_page/mock_banner.jpg" />
<?php else: ?>
<div id="slider">
<img src="<?php echo ($bannerDir = bloginfo('stylesheet_directory') . '/style/images/main_site/banners/services_banners'); ?>/1.jpg" alt="" />
<img src="<?php echo $bannerDir; ?>/2.jpg" alt="" />
<img src="<?php echo $bannerDir; ?>/3.jpg" alt="" />
.............
</div>
<?php endif; ?>
</div><!-- end banner -->
If you don't like the offered solution using the syntaxif(...):...else...endif; you also have the possibilty of using heredoc-style to include bigger html-parts into an echo-statement without the need of escaping it.
The code-formatting in here unfortunatly messed up my example, which I wanted to post. But if you know the heredoc-notation, it should not be a problem ;)
Related
I'm developing a website for an art gallery so all of their product images have different widths and heights depending on the art piece. I want the image to display at 630px wide every time but depending on the image, extend longer down the page than others. Currently, I know that I can adjust the $bigImageX and $bigImageY of the product images from the media.php file located in
/app/design/frontend/default/theme706/template/ecommerceteam/cloud-zoom/catalog/product/view
but this is only allowing me to set a specific width and height. If I set only the height, it shrinks so that the width is the same as the height.
<div class="product-img-box">
<script type="text/javascript" src="http://citizen.bluelotuscreative.com/skin/frontend/default/theme706/js/klass.min.js"></script>
<script type="text/javascript" src="http://citizen.bluelotuscreative.com/skin/frontend/default/theme706/js/code.photoswipe.jquery-3.0.5.js"></script>
<div class="product-box-customs">
<p class="product-image">
<img src="http://citizen.bluelotuscreative.com/media/catalog/product/cache/1/image/630x630/9df78eab33525d08d6e5fb8d27136e95/placeholder/default/Citizen_Atelier_-_Ashley_Woodson_Bailey_2__2.jpg" alt="Test Product" title="Test Product" /> </p>
</div>
</div>
$bigImageX = 630;
$bigImageY = ???;
<div class="product-box-customs">
<?php if ($product->getImage() != 'no_selection' && $product->getImage()): ?>
<p class="product-image">
<a href='<?php echo $this->helper('catalog/image')->init($product, 'image')->resize($bigImageWidth, $bigImageHeight);?>' class = 'cloud-zoom' id='zoom1' rel="<?php echo implode($config, ',');?>">
<img class="big" src="<?php echo $this->helper('catalog/image')->init($product, 'image')->resize($bigImageX, $bigImageY);?>" alt='' title="<?php echo $this->htmlEscape($this->getImageLabel());?>" />
</a>
</p>
<?php else: ?>
<p class="product-image">
<?php
$_img = '<img src="'.$this->helper('catalog/image')->init($product, 'image')->resize($bigImageX, $bigImageY).'" alt="'.$this->htmlEscape($this->getImageLabel()).'" title="'.$this->htmlEscape($this->getImageLabel()).'" />';
echo $outputHelper->productAttribute($product, $_img, 'image');
?>
</p>
Replace:
$this->helper('catalog/image')->init($product, 'image')->resize($bigImageWidth, $bigImageHeight);
With this:
$this->helper('catalog/image')->init($_product, 'image')
->constrainOnly(TRUE)
->keepAspectRatio(TRUE)
->keepFrame(FALSE)
->resize($bigImageWidth,null);
Hello I have in my DB a column called capalivro that has my image paths.
I want to make the img src the content of that column, but I'm not succeding in doing this since I don't know how to put that PHP var in the HTML.
This way I tried doesn't work because the php doesn't work because of the quotation marks.
<?php while ($livro = mysql_fetch_assoc($livrotodos)) { ?>
<div class="large-2 columns">
<div class="livro">
<div class="livro-overlay">
<h3><?php echo $livro['nomelivro'] ?></h3>
</div>
<img src= "<?php $livro['capalivro']?>" />
</div>
</div>
<?php }
?>
</div>
<img src= "<?php $livro['capalivro']?>" />
</div>
should be:
</div>
<img src= <?php echo "\"". $livro['capalivro']."\""?> />
</div>
change your line containing the img src= bit to:
<img src="<?php echo $livro['capalivro']?>" />
without the echo part, it won't display the "string" from the database.
Hello i am updating a WordPress site that was riddled with errors (over 1000...-'-) now i have gotten it down to 15 or so however one page has 105 errors and they are all caused by a stray p tag that is being generated after every image here's what the code is being outputted as
<div id="ngg-image-40" class="ngg-gallery-thumbnail-box" >
<div class="ngg-gallery-thumbnail" >
<a href="a link" title="the title" class="shutterset_set_5" ><br />
<img title="01596-01_1" alt="01596-01_1" src="the src" width="100" height="75" /><br />
</a>
</div>
</p></div>
As you can see there is a p tag there for no reason, I've tried Google but got no one with a solution to this problem, I've tried looking through all the php files for the nextgen gallery and couldn't figure it out the actual code that outputs the gallery is below.
<div id="ngg-image-<?php echo $image->pid ?>" class="ngg-gallery-thumbnail-box" <?php echo $image->style ?> >
<div class="ngg-gallery-thumbnail" >
<a href="<?php echo $image->imageURL ?>" title="<?php echo $image->description ?>" <?php echo $image->thumbcode ?> >
<?php if ( !$image->hidden ) { ?>
<img title="<?php echo $image->alttext ?>" alt="<?php echo $image->alttext ?>" src="<?php echo $image->thumbnailURL ?>" <?php echo $image->size ?> />
<?php } ?>
</a>
</div>
</div>
Again as you can see there is no reference to the p tag in the above. Any and all help is appreciated.
I also did not find a solution within the gallery but I have to admit that I didn't search that well. I was lazy and fixed it with javascript as I use a custom javascript for my gallery. Maybe that helps you, too. It's MooTools btw. and assumes that the gallery div has the id "gallery":
var p = document.id('gallery').getPrevious();
if (p.get('tag') == 'p') {
p.dispose();
}
I want icon-backtotop.png to appear only on the home page and icon-backtotop-alt.png to appear on all other pages. However, with the code below, icon-backtotop-alt.png shows on all pages. How can I fix this code?
<?php if (is_home()) { ?>
<img src="<?php echo get_stylesheet_directory_uri(); ?>/img/icon-backtotop.png" alt="Back To Top" />
<?php } else { ?>
<img src="<?php echo get_stylesheet_directory_uri(); ?>/img/icon-backtotop-alt.png" alt="Back To Top" />
<?php } ?>
you probably want to use is_front_page not is_home
Note: WordPress 2.1 handles this function differently than prior
versions - See static Front Page. If you select a static Page as your
frontpage (see is_front_page()), this tag will be applied to your
"posts page".
try
<?php if (is_front_page()) { ?>
<img src="<?php echo get_stylesheet_directory_uri(); ?>/img/icon-backtotop.png" alt="Back To Top" />
<?php } else { ?>
<img src="<?php echo get_stylesheet_directory_uri(); ?>/img/icon-backtotop-alt.png" alt="Back To Top" />
<?php } ?>
So I am working on my first wordpress site...
I am having a go at converting http://www.benjaminpotter.org/fleet/
to wordpress > http://www.benjaminpotter.org/test/
So there are already a few issues, but one of the things is that I am wanting to call content into the "about us" section on the index page via wordpress to act as a CMS.
This is an image of the back end:
nevertheless it ends up with no content in that section:
this is most likely because I need to put in a bit of code into the page of the website.
This is the current code for that page, and I have commented where I want to call the content mannaged bit... thanks for the help!
<? /* Template Name: Home Page
*/ ?>
<?php get_header(); ?>
<div id="tagline"></div>
<div id="sliderbox">
<img src="<?php bloginfo('template_url'); ?>/images/index/slider/slider_1.jpg" width="1000" height="466" alt="Don't settle for less" />
<img src="<?php bloginfo('template_url'); ?>/images/index/slider/slider_2.jpg" width="1000" height="466" alt="Don't settle for less" />
<img src="<?php bloginfo('template_url'); ?>/images/index/slider/slider_3.jpg" width="1000" height="466" alt="Don't settle for less" />
<img src="<?php bloginfo('template_url'); ?>/images/index/slider/slider_4.jpg" width="1000" height="466" alt="Don't settle for less" />
</div>
<a id="arrow2" class="arrow"></a>
<a id="arrow1" class="arrow"></a>
<a href="order.php" id="car_logo_slider" onmouseover="tooltip.show('');" onmouseout="tooltip.hide();">
<img src="<?php bloginfo('template_url'); ?>/images/index/car_slider/cars1.jpg" width="1001" height="86" alt="cars" />
<img src="<?php bloginfo('template_url'); ?>/images/index/car_slider/cars2.jpg" width="1001" height="86" alt="cars" />
<img src="<?php bloginfo('template_url'); ?>/images/index/car_slider/cars3.jpg" width="1001" height="86" alt="cars" />
</a>
<div id="wrapper-contunue">
<div id="mission_vision_header"></div>
<? include('inc/quickcontact.html'); ?>
<div id="mission_vision_text">
<!-- THE CONTENT MANAGED BIT! -->
<!-- THE CONTENT MANAGED BIT! -->
<!-- THE CONTENT MANAGED BIT! -->
<!-- THE CONTENT MANAGED BIT! -->
<!-- THE CONTENT MANAGED BIT! -->
</div>
<div style="margin-top:450px;" class="seperator"></div>
<div id="our_process" class="highlighed_div">
<div id="our_process_header"></div>
<div id="initial_text_our_process">
Here at Fleet Avenue, we have a simple and straight forward process towards acquiring our cars for you. This four step process is fast and effective, consisting of the following steps:
</div>
<div id="our_process_stages_graphic"></div>
<div id="explanatiory_text_our_process">
<div id="process_inquire">
<a id="inquire_button" href="order.php"></a>
</div>
</div> <?php get_footer(); ?>
<?php echo get_content(); ?>
Or
<?php
global $post;
echo $post->post_content;
?>
i believe you need to wrap you call to the_content() in the Wordpress loop
<?php
if ( have_posts() ) {
while ( have_posts() ) {
the_content();
} // end while
} // end if
?>
this is a very basic example if you make other calls later you will need to reset the query call after this one.
more info here: https://codex.wordpress.org/The_Loop