CODEWITHSUNDEEP
phphtmlcsswordpressfunction
brvnks
brvnks

Reputation: 11

How to display images in Wordpress

I'm doing a test for a job and I already have a folder with some images and a HTML & CSS already done. They just want me to put this in Wordpress.

How can I display this images that I have into the HTML or functions? Ex:

<div class="container container-nav w-container"><a href="#" class="logo-nav w-nav-brand"><img src="images/Logo_Trust_White.png" alt=""></a>

This is what i have in my HTML file. Can I use "wp_get_attachment_image('imagename');"?

Thank you already!

Upvotes: 1

Views: 14793

Answers (4)

Vasim Shaikh
Vasim Shaikh

Reputation: 4512

The function wp_get_attachment_image only gets an image that was uploaded to wordpress, it doesn't output an image in the content of the post.

You have to output the content of the post for your example image.

Like: echo $attachments['post_content'];

you're passing in the post id (54 in your example; typically $post->ID in WP parlance) to wp_get_attachment_image(). As can be seen in the codex, you're supposed to use the attachment id (see $attachment_id below):

wp_get_attachment_image( $attachment_id, $size, $icon );

In other words, you've got to do something like this:

$image_attr = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), 'medium');

In general I would avoid using theme specific images in the content, because when you change and delete the old theme, then they are gone. So I would consider using /wp-content/uploads/ for content images.

What is a Custom Logo?

Using a custom logo allows site owners to upload an image for their website, which can be placed at the top of their website. It can be uploaded from Appearance > Header, in your admin panel. The custom logo support should be added first to your theme using add_theme_support(), and then be called in your theme using the_custom_logo(). A custom logo is optional, but theme authors should use this function if they include a logo to their theme.

https://developer.wordpress.org/themes/functionality/custom-logo/

Upvotes: 1

SM Imtiaz Hussain
SM Imtiaz Hussain

Reputation: 447

If you want to display the image file located within your theme directory, just specify the location with the img tag, and style it with CSS.

<img src="<?php echo get_template_directory_uri() . '/images/Logo_Trust_White.png'; ?>" />

Reference : https://developer.wordpress.org/themes/functionality/media/images/

Upvotes: 3

Sajid anwar
Sajid anwar

Reputation: 1194

Using get_template_directory_uri() to link a static image with its correct path in html :

<img src="<?php echo get_template_directory_uri(); ?>/images/logo.png" width="" height="" alt="" />

Place you images in your active theme. Path will be wp-content/themes/{theme-name}.

Upvotes: 0

Foxtrail815
Foxtrail815

Reputation: 53

Replace your img tag with 

<img src="<?php echo get_template_directory_uri(); ?>/images/Logo_Trust_White.png" alt="">

Place your images folder in the wp-content folder

Upvotes: 0

Related Questions