make child page link display an overlay effect on the parent page

  • Not sure how I would achieve this or if I’ll be able to explain it properly but here it goes…

    Looking to add an overlay (something like the word “NEW” in a star or something) over the corner of the image showing the product (the images are links to the product pages) so I can show which products are new.

    Currently, the only way I can think to achieve this is by changing the featured image on the page to have that star in it but it very quickly will be hard to keep track of that as there are a few thousand products on the site with a couple of dozen added per week.

    My ideal solution would be a plugin that adds a box to the “page-attributes” section that says “new product?” and a checkbox beside it and then somewhere in the plugin setting I can set how many days the overlay effect would last on that product (example 10 days) and then it would automatically remove itself.

    I don’t think anything like that exists but I think it demonstrates the functionality I am looking for! If anyone has any ideas on how to tackle this or if it is possible at all it’s greatly appreciated!

    Cheers!

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • Moderator bcworkz

    (@bcworkz)

    You can add fields to the page attributes box through the ‘page_attributes_misc_attributes’ action. You’ll need code to save your field value. The ‘save_post’ action is a common one to use for this. You will then need to alter the template that outputs images to check for this value and conditionally add the “new!” element image along with the usual image. Use CSS to move the overlay from its default next to location to over the image.

    The devil is in the details, but that’s the gist of it.

    Thread Starter ryanchmura

    (@ryanchmura)

    @bcworkz Thanks for the reply!

    I am pretty lost when digging through PHP, I found the plugin “advanced custom fields” and added a separate meta box set up to have a radio button for if it is new or not and now it displays on all “edit page” pages on the backend.

    How would I go about finding this in backend? Would it be in meta-boxes.php? Where would I build the conditional logic and how would I reference the other file? Is there any support material on this?

    Cheers

    Moderator bcworkz

    (@bcworkz)

    I’m not sure what you want to find in the backend if you are using the ACF plugin. All the backend stuff is handled by the plugin. You will need to alter the template responsible for image output, adding code to check the ACF field valuie and conditionally output the New! overlay.

    If you are using WooCommerce for product pages, it has its own templates for this. While you can override the default templates, it’s better to use filters to achieve what you want if at all possible. WooCommerce has its own set of documentation and dedicated support forums. One forum for users of the free version hosted on www.remarpro.com, and another through their own website for premium version customers. If you cannot find an appropriate filter in their documentation, try asking in whichever forum is appropriate.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘make child page link display an overlay effect on the parent page’ is closed to new replies.