• Hi beautiful people can you help me on how I can implement my goal to view the PDF File once the thumbnail Post Picture is clicked?
    I am using WordPress 5.7.2 with custom code/ theme. usually when we created a custom post we used the `<?php the_permalink(); ?> to open the another page and view the full details once we clicked the thumbnail picture post. but this time, I like my Thumbnail post picture links to PDF File. so when I click the thumbnail post picture –> the link will open to a PDF view file not the usual permalink page. is that possible? or is there a way how at least just open the PDF file when click the Thumbnail picture?

Viewing 13 replies - 1 through 13 (of 13 total)
  • If you want to open the file isntead of the page then use this instead.

    <?php echo esc_url (wp_get_attachment_url (get_the_ID ())); ?>

    That will give you back the URL of the file that’s attached to the current attachment.

    Thread Starter Xen

    (@aloveyu)

    Hi @catacaustic thank you for your comment and code however I’ve tried the given code but the output is nothing??? I don’t know if the used of code is right? should I need to replace the
    <a href="<?php the_permalink(); ?>">
    to
    <a href="<?php echo esc_url (wp_get_attachment_url (get_the_ID ())); ?>">

    • This reply was modified 3 years, 8 months ago by Xen.
    • This reply was modified 3 years, 8 months ago by Xen.
    • This reply was modified 3 years, 8 months ago by Xen.
    • This reply was modified 3 years, 8 months ago by Xen.
    • This reply was modified 3 years, 8 months ago by Xen.
    • This reply was modified 3 years, 8 months ago by Xen.
    • This reply was modified 3 years, 8 months ago by Xen.
    Thread Starter Xen

    (@aloveyu)

    sorry I am having difficulties on how the code attached on this post

    • This reply was modified 3 years, 8 months ago by Xen.

    The code looks right how you have it, and if you were using the the_permalink() funciton before, it should work the same way.

    At this stage you need to look at doing soem basic debugging. Try allowing wP_DEBUG in youw wp-config.php file to see if there’s any errors showing. If not you can always try something like this to see where things are and are not working.

    <?php
    $id = get_the_ID();
    echo "<p>ID: '".$id."'</p>";
    echo "<p>URL: '".wp_get_attachment_url ($id)."'</p>";
    ?>

    Check that the right ID is given, and that there is a URL returned from the file.

    Thread Starter Xen

    (@aloveyu)

    Hi @catacaustic yes, I am using the wp_debug and there is no error showing. I tried your last code provided but the PDF file doesn’t open. I only noticed that this code was echoed to the address bar <p>ID:%20'25'</p><p>URL:%20''</<p>ID:%20'25'</p><p>URL:%20''</p>

    To the address bar? I don’t know what you’re doing there, but it’s something very wrong.

    Can you put the FULL block of code that you are working with. That way we can see waht you are actually trying to do and hopefully see where the problem is.

    Thread Starter Xen

    (@aloveyu)

    here is my code so far:

    <?php
    $args = array(
    'post_type' => 'post',
    'posts_per_page' => 9,
    'orderby' => 'post_date',
    'order' => 'DESC',
    'post_status' => 'publish',
    );
    $posts = get_posts( $args );
    foreach ( $posts as $post ):
    setup_postdata( $post );
    ?> 
    
    <div class="card text-center">
    <a  href="<?php the_permalink(); ?>">  
    <?php if (has_post_thumbnail()) : ?>
    <?php the_post_thumbnail('imgResize'); ?>
    <?php else : ?>
    <img src="<?php echo get_template_directory_uri(); ?>/image/general.jp" alt="img" >
    <?php endif; ?>
    </a>
    <p class="date"><?php the_time('Y.m.d'); ?></p>
    <div class="card-body">
    <a  href="<?php the_permalink(); ?>">  
    <p class="card-text">“<?php the_title(); ?>”</p>
    </a>
    </div> 
    </div>
    <?php endforeach; wp_reset_postdata(); ?>
    Thread Starter Xen

    (@aloveyu)

    Then I tried your code like this:

    <?php
    $args = array(
    'post_type' => 'post',
    'posts_per_page' => 9,
    'orderby' => 'post_date',
    'order' => 'DESC',
    'post_status' => 'publish',
    );
    $posts = get_posts( $args );
    foreach ( $posts as $post ):
    setup_postdata( $post );
    ?> 
    
    <div class="card text-center">
    <a href="<?php echo esc_url (wp_get_attachment_url (get_the_ID ())); ?>"> 
                                    <?php
                                    $id = get_the_ID();
                                    echo "<p>ID: '".$id."'</p>";
                                    echo "<p>URL: '".wp_get_attachment_url ($id)."'</p>";
                                    ?>
    <?php if (has_post_thumbnail()) : ?>
    <?php the_post_thumbnail('imgResize'); ?>
    <?php else : ?>
    <img src="<?php echo get_template_directory_uri(); ?>/image/general.jp" alt="img" >
    <?php endif; ?>
    </a>
    <p class="date"><?php the_time('Y.m.d'); ?></p>
    <div class="card-body">
    <a  href="<?php the_permalink(); ?>">  
    <p class="card-text">“<?php the_title(); ?>”</p>
    </a>
    </div> 
    </div>
    <?php endforeach; wp_reset_postdata(); ?>  

    I’m seeing one thing here that explains it.

    You are not getting attachments, you are getting posts. That means that you have no idea what the attachment is, as the file is part of the attachment, not the post.

    How is the PDF attachment related to the post? Normally it’s going to be using post meta, but you’d need to know that first. If it is, you’d get the post meta value and use that instead.

    $meta_id = get_post_meta (get_the_ID(), 'your_meta_key', true);
    echo '<a href="'.esc_url (wp_get_attachment_url ($meta_id)).'">PDF link</a>';

    You need to know how it’s all stored first. If you didn’t set this up you’d need to ask who ever set up the plugin or theme that’s providing that functionality.

    Thread Starter Xen

    (@aloveyu)

    HI @catacaustic yes exactly, I’m sorry if I didn’t explained it well. since we found what the goal is. I am quite confused where your last code will be inserted? ^^

    I uploaded the PDF file using the Add Media button from the custom post.

    • This reply was modified 3 years, 8 months ago by Xen.
    Thread Starter Xen

    (@aloveyu)

    the problem now is I don’t understand where to find my meta key or how to create a meta key

    • This reply was modified 3 years, 8 months ago by Xen.

    A media file is attached to a post when you upload it while viewing that post. But I recommend you to use the Media Library’s list view to attach files.

    Then, this code retrieves the PDF attachment and makes a link to it.

    <?php
    // Get all PDFs that are attached to this post in the loop
    $pdf_attachments = get_attached_media('application/pdf', get_the_ID());
    
    // Pull out the first attached PDF (even if there's only one, the above returns an array)
    $pdf_attachment = key($pdf_attachments);
    
    // Get the link to the PDF
    $pdf_link = wp_get_attachment_url($pdf_attachment);
    ?>
    <a href="<?php echo $pdf_link ?>">Link to PDF</a>

    the problem now is I don’t understand where to find my meta key or how to create a meta key

    Then you need to find that out first. There’s no way to get a specific file unless you know where it’s coming from. rickymccallum87’s code above will get every PDF file that’s attached to the current post, but again if you want a specific file you need to know how to get that files ID first, and unless you know how it’s attached, how to find it or what plugin is used to set that up we can’t help.

Viewing 13 replies - 1 through 13 (of 13 total)
  • The topic ‘View the PDF file when clicked’ is closed to new replies.