Save as Image WordPress Plugin Documentation
Overview
The Save as Image WordPress Plugin adds image download buttons to WordPress posts and pages. It can save a whole page or selected content.
Button placement and image settings are configured in WordPress. PDFCrowd renders the content on its servers and returns the image.
Save as Image WordPress Plugin product overview
Installation
Install the plugin from WordPress.org, then activate it in your WordPress dashboard. The WordPress Dashboard method is recommended for most sites. Plugin page: Save as Image by PDFCrowd.
- Log in to WordPress admin.
- Go to
Plugins > Add New. -
Search for
Save as Image by PDFCrowd. - Click
Install Now, thenActivate.
- Download the plugin ZIP file: save-as-image-pdfcrowd-4.6.0.zip.
- In WordPress admin, go to
Plugins > Add New > Upload Plugin. - Choose the ZIP file and click
Install Now. - Click
Activate Plugin.
After activation, continue to Getting Started.
Getting Started
Start by confirming that the button appears and creates a file.
First Screenshot
- Open one post or page that you can safely test.
- Click the Save as Image button.
- Check the generated image.
The default URL mode fetches a fresh page rather than its current browser state. Content mode sends the current HTML from the browser, including content your site has prepared for download. See Conversion Mode and check the result with your theme.
Next, use Adjust the Image Result to tune the screenshot output. Use Troubleshooting only if the button does not respond or conversion fails.
Testing safely
By default, the button can appear automatically on common content types such
as posts and pages. If you are testing on a production site, review
Settings > Save as Image
first and limit where the button appears before testing with real visitors.
After the button creates a file, use the option reference for detailed button and screenshot settings.
License
The plugin can run in demo mode without a PDFCrowd account or API key. Demo output is functional, but it includes a PDFCrowd watermark and branding.
For production output without demo branding, activate a PDFCrowd license in
WordPress under
Settings > Save as Image > License.
To get production credentials, choose a PDFCrowd license. Current plan limits and credits are listed on the license page.
The plugin uses PDFCrowd's cloud conversion service. Your plan controls production limits and credits; use the pricing and account pages for current details. A PDFCrowd license can also be used for direct API integrations.
Adjust the Image Result
Use these settings when an image is created but its size, format, layout, or included content needs adjustment. Some options require Expert Settings. See the option reference for the full list of settings.
Try conversion settings in the API Playground. For plugin guidance, see the WordPress FAQ.
| Image size | Customize the dimensions of the captured images using the Screenshot Width and Screenshot Height. |
| Image format | Change the ouput image format using Output Format. |
| Hide or Remove Contents |
Use the following classes in your HTML code to hide or remove
elements from the output:
|
| Custom CSS Styling |
To customize CSS styling specifically for the conversion, use
Custom Css to inject additional styles.
Alternatively, you can directly incorporate conversion-specific styling into your main stylesheet. Just prefix your CSS selectors with `.pdfcrowd-body` to ensure
the styles apply only during the conversion process. For
example:.pdfcrowd-body h1 { font-size: 48px; }.pdfcrowd-body footer { display: none; }
|
| Use `@media print` |
Activate the print version of a webpage (if
available) using Use Print Media.
This function instructs the plugin
to apply the CSS rules defined within the `@media print`
stylesheet, ensuring the output mirrors the print-optimized version of the webpage.
|
| Inject Custom JavaScript | Use Custom Javascript or On Load Javascript to modify HTML content using custom JavaScript scripts. These scripts run when the page loads, allowing you to dynamically alter elements, styles, or behavior. In addition to the standard browser JavaScript APIs, your scripts can leverage helper functions provided by our JavaScript library. |
Image Output > Screenshot Width: Experiment with different widths to see which yields the best result.
The maximum size for any created image is 65 megapixels. Images exceeding this size are cropped vertically to meet this limit.
Advanced Usage
Shortcode
Use a shortcode when you want to place the button manually in post or page content. If automatic placement is also enabled for the same content type, disable it in the Show Button on setting so the button does not appear twice.
You can use either a plain or block shortcode.
-
[save_as_image_pdfcrowd]saves the entire webpage as Image. -
[block_save_as_image_pdfcrowd]saves only the enclosed code block as Image. To style the block, include CSS rules within the shortcode.
The examples below demonstrate how to use the shortcodes and override the default settings configured in the plugin.
<h3>Save the print version of the page</h3> The button is placed in the middle [save_as_image_pdfcrowd \ use_print_media=1 \ output_format='png' \ output_name='inline.png' \ button_text='Save print version to PNG'] of this sentence. <h3>Save the screen version of the page</h3> [save_as_image_pdfcrowd \ use_print_media=0 \ output_name='browser.png' \ button_text='Save screen version to PNG' ] <h3>Save only a code block</h3> [block_save_as_image_pdfcrowd \ output_name='just_div.png' \ button_text='Download just this section as PNG' \ screenshot_width='800' \ button_background_color='green' \ button_alignment='left'] <style> .invoice { font-size: 150%; } </style> <div class="invoice"> Save only this div and its descendants. </div> [/block_save_as_image_pdfcrowd] <h3>Convert any web page</h3> [save_as_image_pdfcrowd \ url='https://wikipedia.org' \ output_name='wikipedia.png' \ button_text='Save Wikipedia as PNG']
PHP button helper
Use this helper when a theme or plugin needs to print the normal Save as Image button from PHP instead of placing a shortcode in page content:
create_save_as_image_pdfcrowd_button($options = array())
The helper returns button HTML. The visitor still clicks the button in the browser, and the button uses the same conversion flow as automatic placement or shortcode placement.
The $options argument overrides the saved plugin
settings for this button only. Omit any settings that should keep their values
from Settings > Save as Image. For example:
echo create_save_as_image_pdfcrowd_button(array( 'screenshot_width' => '800', 'button_text' => 'Save as Image' ));
Server-initiated PHP conversion
Use this function only when PHP code should run a conversion immediately, without showing a visitor-facing button:
pdfcrowd_save_as_image($options = array())
This function does not use the saved plugin settings as defaults. Pass the
conversion input and all options the conversion needs, including your PDFCrowd
username and API key. The function returns the generated file data on success
or WP_Error on failure. For example:
<?php $output = pdfcrowd_save_as_image(array( 'username' => '', 'api_key' => '', 'output_format' => 'png', 'screenshot_width' => '800', 'url' => 'https://www.example.com/' )); if(!is_wp_error($output)) { echo $output; } ?>
Troubleshooting
Use this section when the button does not respond, conversion fails, or no image is created. If an image is created but its appearance needs adjustment, start with Adjust the Image Result.
- If you are receiving an error, refer to the API Status Codes for more information.
- Use Debug Log to obtain detailed information about the conversion process, including load errors, load times, browser console output, etc.
- Consult the FAQ for answers to common questions.
- Contact us if you need assistance or if there is a feature you are missing.
Option Reference
Refer to the Save as Image WordPress Plugin Reference for a description of all options.