I have created a blog using wordpress, it has been developed on my localhost and the theme is the LUGADA Theme found here.
I want to add a logo which is bigger than the specfied size in theme that has been specified as 300 x 70 by the designer. When I try and upload a new logo using the facility they provide, it forces me to crop the image to their required size, how do I get around this?
I looked at header.php and found this:
<img src="<?php header_image(); ?>" width="<?php echo HEADER_IMAGE_WIDTH; ?>" height="<?php echo HEADER_IMAGE_HEIGHT; ?>" alt="" />
I have tried taking HEADER_IMAGE_WIDTH and HEADER_IMAGE_HEIGHT out but the upload facility forces me to crop the image
I have considered hardcoding the logo in but want it to still be available when I change the theme. I have also tried tracking down header_image(), which I found in wp-includes/theme.php but could not work out what to do from there.
Could someone please advise how I put a logo sized to my requirements in please?
There are a couple of tweaks to this theme that I would recommend, and they should achieve the results you're looking for.
First, the theme is currently using a deprecated method (add_custom_image_header) in order to allow you to upload your logo. Let's temporarily stop that, use a newer function, and if you're happy with the results you can follow my instructions to clean up the code.
Open functions.php and find lines 135, 136, and 176 and comment them out:
//define('HEADER_IMAGE_WIDTH', 300); // use width and height appropriate for your theme
//define('HEADER_IMAGE_HEIGHT', 300);
//add_custom_image_header('lugada_header_style', 'lugada_admin_header_style');
Add the following code after line 176:
$header_defaults = array(
'width'=>300,
'height'=>200,
'flex-height'=>true,
'flex-width'=>true
);
add_theme_support( 'custom-header', $header_defaults );
In your header.php file, go ahead and replace line 68 with this code (remove the width and height attributes):
<img src="<?php header_image(); ?>" alt="" />
Some notes on this code...
You're now using a newer method for the custom header logo. This means you'll have fewer problems upgrading WordPress in the future
Your now using flexible height and width so you can crop however you wish
You can change those height and width values to whatever you wish (for defaults)
You can find more information about the usage of add_theme_support here, and you may find even more helpful options.
If you're happy with the results and want to clean up the code you can delete lines 135, 136, and 176 and delete the two functions named lugada_header_style and lugada_admin_header_style.
Have fun!
Related
I'm really new in coding, especially in css. I already read some tutorials but I like to change a specific thing. For my Website I use Wordpress. I also edited a few things in my CSS which already worked. Now I can't find a answer for how I can replace the title with a custom picture.
Click here to watch a picture to understand what I mean.
Click here to acess my website.
I already tried some things, but it would be nice if someone can explain me how to do it.
You can edit header.php in the twenty seventeen to display only a picture.
This source code is on your wordpress server in wp-content/themes/twenty-seventeen/header.php: https://github.com/WordPress/twentyseventeen/blob/master/header.php
You'll want to replace line 31:
<?php get_template_part( 'components/header/header', 'image' ); ?>
With something like
<img src="banner.png" />
You'll have to adjust the location of banner.png to where you actually upload the image.
After you've got that working and it's basically what you want, you can wrap the image tag in a a tag so the banner links back to your home page, if you'd like.
I am trying to hide the blog post thumbnails inside the blogposts, but at the same time I want to keep the thumbnails in my blog overview.
So far, I used the following CSS to make the thumbnail images disappear:
.attachment-post-thumbnail {display:none;}
However, this also makes them disappear on my blog overview: www.wavebutler.surf/surf-blog
Could anybody help me and let me know what CSS I could use to make the thumbnails disappear inside the posts. It would be very much appreciated!
Not sure if you found your solution or not but, Depending on your themes structure, in single.php look for something like
if(has_post_thumbnail()) :
the_post_thumbnail();
endif;
If you remove it from single.php or comment it out your single posts will no longer have your featured images
This could also be located in content.php which in this case you can just put a conditional statement on it.
if(!is_single()) :
if(has_post_thumbnail()) :
the_post_thumbnail();
endif;
else :
// continue on
endif;
Probably won't be this general as again it will depend on your theme but in a nut shell is how it can be done.
I have an installation of Magento that integrates with Wordpress using the Fishpig Wordpress module.
As most WP users will know, when uploading an image Wordpress will create resized versions referencing the dimensions set in Media Settings (e.g. Thumbnail Size, Medium Size and Large Size). It also creates images for each custom thumbnail size you specify (e.g. via functions.php).
It appears as though the Fishpig Magento module only uses the Thumbnail image size.
Unfortunately I need to be able to display different sizes of the same image (i.e. the resized versions that Wordpress creates) on different pages. For example, the category page will display a small version, the post view page will display a larger version.
I was wondering if anyone has had any experience retrieving the other resized images via this module as I can't find much documentation on it (or if it's even possible with this module as I also couldn't see any code that would suggest this functionality).
Greatly appreciate the help.
I had the same issue...I wanted to create a recent posts widget and Fishpig has that well documented, but they didn't show an example of how to pull the featured image for the post.
But I found the answer in: /app/design/frontend/base/default/template/wordpress/post/list/renderer/default.phtml:
<?php if ($featuredImage = $post->getFeaturedImage()): ?>
<div class="featured-image left">
<img src="<?php echo $featuredImage->getAvailableImage() ?>" alt="<?php echo $this->escapeHtml($post->getPostTitle()) ?>"/>
</div>
<?php endif; ?>
You can change "getAvailableImage" to anyone of these to pull the different images sizes that wordpress produces:
getThumbnailImage()
getMediumImage()
getLargeImage()
getFullSizeImage()
getPostThumbnailImage()
getAvailableImage()
getImageByType($type = 'thumbnail')
Hope this helps!
Have try to do using below code. and working fine for me..
echo $featuredImage->getData('guid');
I am developing one wordpress site. I have made one post in it. Now I want to assign image in that post. For this, I have uploaded one image in media and attach that image to my post.
but how can I assign that uploaded image in my post? do I need to give path manually? or I can give dynamic path so that even if I upload this site on server or change main folder name, path gets changed automatically..
any help will be appreciated..
thank you
You should consider using Post Thumbnails (also known as Featured Images) in your posts. To do this, all you need to do is add the following to your functions.php file:
add_theme_support('post-thumbnails');
This will add a control in your Post Editor to add an image by either Uploading it or setting the URL, effectively "attaching" your image to your post in the way your looking for. To display the image in your template:
<?php
if(have_posts()) : while(have_posts()) : the_post();
if(has_post_thumbnail())
echo '<div class="post_thumb">'.get_the_post_thumbnail().'</div>';
?>
<div class="post_content"><?php the_content(); ?></div>
<?php
endwhile;endif;
?>
As for changing folder names, paths, etc. you need to be careful with that approach. Remember that you're giving a path to an asset. The server doesn't know what YOU want, only what your code is requesting. If you expect to be changing paths to your assets around quite a bit, then you can always forgo Post Thumbnails in favor of clever naming conventions. Something like this:
<?php
if(have_posts()) : while(have_posts()) : the_post();
$imgPath = get_bloginfo('stylesheet_directory').'/images/featured_'.$post->post_name.'.jpg';
?>
<div class="post_thumb"><img src="<?php echo $imgPath; ?>" /></div>
<div class="post_content"><?php the_content(); ?></div>
<?php
endwhile;endif;
?>
This looks for an image in your Theme Directory's images folder that is named featured_{post_slug}.jpg
The benefits to this approach is that Wordpress will always know where your theme folder is, regardless of URL changes. As long as you have an images folder in your theme directory, Wordpress will know where to look.
The drawback is that this code specifically doesn't first check for the EXISTENCE of the image before displaying it, which could lead to broken images if they aren't named properly or don't exist at all. This approach also requires the use of one file extension
A last option for you is to consider using Custom Fields to define paths to images. The benefit is that this does not require you to actually upload images to your server. However, this approach is still the least dynamic out of all of your options, and will likely break if paths to assets are changed.
Use whichever tool you feel is best for the job. Hope this helps!
I'm trying to use Wordpress' built-in thumbnailing and image re-sizing in my Wordpress 2.9.2 installation. I'm trying to get various sizes (post listing/results 160x160 & "single.php" 618x150) and for some reason the single.php one works, but only half way. Not sure if I'm doing something wrong here.
I have it working…sorta. I’m totally stuck and there seems to be a lack of documentation on the Codex for this feature so here goes.
The small 160×160 thumbnail for article listings/search views works fine. It crops it, all’s groovy. The issue comes when I go to format the image for the single.php article details view. It crops, but then scales down even further for some reason.
Screenshot:
http://c1319072.cdn.cloudfiles.rackspacecloud.com/4-15-2010%204-56-46%20PM.png
NOTE: every time I re-test this I’m completely deleting the image from the media section and re-uploading the image entirely. I also have the re-create thumbnails plugin so I know it’s not caching.
Here is my code included in "functions.php". This will help in debugging.
add_theme_support( ‘post-thumbnails’ );
set_post_thumbnail_size( 160, 160, true ); // Normal post thumbnails
add_image_size( ’single-post-thumbnail’, 618, 150, true ); // Permalink thumbnail size
I just wrote a detailed post regarding the wordpress post thumbnails a few days ago, you might find it very useful as it is very detailed.
How to use Post Thumbnails Feature in Wordpress!
I had similar problems trying to get it to work and finally went with TimThumb.
I simply love it's simplicity and effectiveness. It works great, has cache capabilities and it's fast and easy.
Official site (includes tutorial): http://www.darrenhoyt.com/2008/04/02/timthumb-php-script-released/
And here's an example on how I call it in my Wordpress:
<img src="<?php echo bloginfo('template_url'); ?>/thumb.php?src=<?php echo get_post_meta($post->ID, "image", $single = true); ?>&h=75&w=75&zc=1&q=90" alt="<?php the_title(); ?>" />
(loads the image URL from a custom field of the post and resizes it to 75x75 and 90% quality)