One of the features added in version is the ability to add Download Magnet to an existing element on your page. Most of the time it would be a button (a call to action) but we did test on images as well! This allows you to keep the styling you want. It does require work on both the Download Magnet entry as well as on the page element you want to attach the Download Magnet popup dialog.
Download Magnet Entry (Post) #
When creating or editing the entry, two things to consider. First, select “Attach to Button” as the Download Magnet Style option.
Secondly, at the bottom of that section, review the wp_footer option. Most of the time this can be left unchecked. Download Magnet now places the code for the dialog box in the wp_footer hook. Most themes add this as part of their design, however there may be times that the wp_footer hook was not added and is not available. If you find the dialog box does not show when testing, check this option and the dialog code is inserted at the point of the shortcode on the page design.
Adding to the Page or Post #
Now we have the post entry, some work needs to be done on the page. Copy the shortcode needed. When using the “Attach to Button” option, an extra parameter is needed so that we know what button the dialog will now be attached too. We will show how to add for the Block Editor, Elementor and Divi. Other page builders should work in a similar way.
Generally adding the Download Magnet dialog to a button (or other element) needs three stages.
- Provide an unique “id” to the button
- Give the button a dummy or false URL such as #download (to prevent flashing or going back to top of the page).
- Add the Download Magnet shortcode to the page and use the button “id” to add to the shortcode.
For more information on adding the Download Magnet dialog to your page design can be found below.