first commit
This commit is contained in:
240
wp-content/plugins/svg-support/admin/admin-init.php
Normal file
240
wp-content/plugins/svg-support/admin/admin-init.php
Normal file
@@ -0,0 +1,240 @@
|
||||
<?php
|
||||
/**
|
||||
* Admin init
|
||||
*/
|
||||
if ( ! defined( 'ABSPATH' ) ) {
|
||||
exit; // Exit if accessed directly
|
||||
}
|
||||
|
||||
/**
|
||||
* Add menu item to wp-admin
|
||||
*/
|
||||
function bodhi_svgs_admin_menu() {
|
||||
|
||||
$bodhi_svgs_options_page = add_options_page(
|
||||
__('SVG Support Settings and Usage', 'svg-support'),
|
||||
__('SVG Support', 'svg-support'),
|
||||
'manage_options',
|
||||
'svg-support',
|
||||
'bodhi_svg_support_settings_page'
|
||||
);
|
||||
|
||||
// load the help menu on the SVG Support settings page
|
||||
add_action( 'load-' . $bodhi_svgs_options_page, 'bodhi_svgs_help_tab' );
|
||||
|
||||
require( BODHI_SVGS_PLUGIN_PATH . 'admin/svgs-settings-page-help.php' );
|
||||
|
||||
}
|
||||
add_action( 'admin_menu', 'bodhi_svgs_admin_menu' );
|
||||
|
||||
/**
|
||||
* Create settings page
|
||||
*/
|
||||
function bodhi_svg_support_settings_page() {
|
||||
|
||||
if ( ! current_user_can( 'manage_options' ) ) {
|
||||
|
||||
wp_die( esc_html__('You can\'t play with this.', 'svg-support') );
|
||||
|
||||
}
|
||||
|
||||
$bodhi_svgs_options = get_option( 'bodhi_svgs_settings' );
|
||||
|
||||
require( BODHI_SVGS_PLUGIN_PATH . 'admin/svgs-settings-page.php' );
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Sanitize and save settings
|
||||
*/
|
||||
function bodhi_svgs_settings_sanitize($input) {
|
||||
// Process all settings
|
||||
$output = $input;
|
||||
|
||||
// Sanitize css_target
|
||||
if (isset($output['css_target'])) {
|
||||
$output['css_target'] = esc_attr( sanitize_text_field( $output['css_target'] ) );
|
||||
}
|
||||
|
||||
// Handle sanitize_svg_front_end setting
|
||||
if (!isset($output['sanitize_svg_front_end']) || $output['sanitize_svg_front_end'] !== 'on') {
|
||||
$output['sanitize_svg_front_end'] = false;
|
||||
}
|
||||
|
||||
// Handle sanitize_on_upload_roles setting
|
||||
if (!isset($output['sanitize_on_upload_roles'])) {
|
||||
$output['sanitize_on_upload_roles'] = array("none");
|
||||
} else {
|
||||
$output['sanitize_on_upload_roles'] = (array)$output['sanitize_on_upload_roles'];
|
||||
}
|
||||
|
||||
// Handle restrict setting
|
||||
if (!isset($output['restrict'])) {
|
||||
$output['restrict'] = array("none");
|
||||
} else {
|
||||
$output['restrict'] = (array)$output['restrict'];
|
||||
}
|
||||
|
||||
return $output;
|
||||
}
|
||||
|
||||
/**
|
||||
* Register settings in the database
|
||||
*/
|
||||
function bodhi_svgs_register_settings() {
|
||||
|
||||
$args = array(
|
||||
'sanitize_callback' => 'bodhi_svgs_settings_sanitize'
|
||||
);
|
||||
|
||||
register_setting( 'bodhi_svgs_settings_group', 'bodhi_svgs_settings', $args );
|
||||
|
||||
}
|
||||
add_action( 'admin_init', 'bodhi_svgs_register_settings' );
|
||||
|
||||
/**
|
||||
* Remove old sanitize setting
|
||||
*/
|
||||
function bodhi_svgs_remove_old_sanitize_setting() {
|
||||
// Fetch current settings
|
||||
$bodhi_svgs_options = get_option('bodhi_svgs_settings');
|
||||
|
||||
// Remove the old 'sanitize_svg' setting if it exists
|
||||
if (isset($bodhi_svgs_options['sanitize_svg'])) {
|
||||
unset($bodhi_svgs_options['sanitize_svg']);
|
||||
update_option('bodhi_svgs_settings', $bodhi_svgs_options);
|
||||
}
|
||||
}
|
||||
add_action('admin_init', 'bodhi_svgs_remove_old_sanitize_setting');
|
||||
|
||||
/**
|
||||
* Advanced Mode Check
|
||||
* Creates a usable function for conditionals around the plugin
|
||||
*/
|
||||
function bodhi_svgs_advanced_mode() {
|
||||
|
||||
global $bodhi_svgs_options;
|
||||
|
||||
if ( ! empty( $bodhi_svgs_options['advanced_mode'] ) ) {
|
||||
|
||||
return true;
|
||||
|
||||
} else {
|
||||
|
||||
return false;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
add_action( 'admin_init', 'bodhi_svgs_advanced_mode' );
|
||||
|
||||
/**
|
||||
* Screen check function
|
||||
* Checks if current page is SVG Support settings page
|
||||
*/
|
||||
function bodhi_svgs_specific_pages_settings() {
|
||||
|
||||
// check current page
|
||||
$screen = get_current_screen();
|
||||
|
||||
// check if we're on SVG Support settings page
|
||||
if ( is_object( $screen ) && $screen->id == 'settings_page_svg-support' ) {
|
||||
|
||||
return true;
|
||||
|
||||
} else {
|
||||
|
||||
return false;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Screen check function
|
||||
* Checks if the current page is the Media Library page
|
||||
*/
|
||||
function bodhi_svgs_specific_pages_media_library() {
|
||||
|
||||
// check current page
|
||||
$screen = get_current_screen();
|
||||
|
||||
// check if we're on Media Library page
|
||||
if ( is_object( $screen ) && $screen->id == 'upload' ) {
|
||||
|
||||
return true;
|
||||
|
||||
} else {
|
||||
|
||||
return false;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Screen check function
|
||||
* Check if the current page is a post edit page
|
||||
*/
|
||||
function bodhi_svgs_is_edit_page( $new_edit = null ) {
|
||||
|
||||
global $pagenow;
|
||||
|
||||
if ( ! is_admin() ) return false;
|
||||
|
||||
if ( $new_edit == 'edit' ) {
|
||||
|
||||
return in_array( $pagenow, array( 'post.php', ) );
|
||||
|
||||
} elseif ( $new_edit == "new" ) { //check for new post page
|
||||
|
||||
return in_array( $pagenow, array( 'post-new.php' ) );
|
||||
|
||||
} else { //check for either new or edit
|
||||
|
||||
return in_array( $pagenow, array( 'post.php', 'post-new.php' ) );
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Add rating text to footer on settings page
|
||||
*/
|
||||
function bodhi_svgs_admin_footer_text( $default ) {
|
||||
|
||||
if ( bodhi_svgs_specific_pages_settings() || bodhi_svgs_specific_pages_media_library() ) {
|
||||
|
||||
$strong_open = '<strong>';
|
||||
$strong_close = '</strong>';
|
||||
$link_open = '<a href="https://wordpress.org/support/view/plugin-reviews/svg-support?filter=5#postform" target="_blank" class="svgs-rating-link">';
|
||||
$link_close = '</a>';
|
||||
|
||||
// translators: %1$s: Opening strong tag, %2$s: Closing strong tag, %3$s: Opening anchor tag for rating link, %4$s: Closing anchor tag
|
||||
$text = esc_html__( 'If you like %1$sSVG Support%2$s please leave a %3$s★★★★★%4$s rating. A huge thanks in advance!', 'svg-support' );
|
||||
|
||||
echo wp_kses(
|
||||
sprintf(
|
||||
$text,
|
||||
$strong_open,
|
||||
$strong_close,
|
||||
$link_open,
|
||||
$link_close
|
||||
),
|
||||
array(
|
||||
'strong' => array(),
|
||||
'a' => array(
|
||||
'href' => array(),
|
||||
'target' => array(),
|
||||
'class' => array()
|
||||
)
|
||||
)
|
||||
);
|
||||
|
||||
} else {
|
||||
|
||||
return $default;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
add_filter( 'admin_footer_text', 'bodhi_svgs_admin_footer_text' );
|
||||
BIN
wp-content/plugins/svg-support/admin/img/shortpixel.png
Normal file
BIN
wp-content/plugins/svg-support/admin/img/shortpixel.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.3 KiB |
@@ -0,0 +1,45 @@
|
||||
<?php
|
||||
/**
|
||||
* Plugin action and row meta links
|
||||
*/
|
||||
if ( ! defined( 'ABSPATH' ) ) {
|
||||
exit; // Exit if accessed directly
|
||||
}
|
||||
|
||||
/**
|
||||
* Add plugin_action_links
|
||||
*/
|
||||
function bodhi_svgs_plugin_action_links( $links ) {
|
||||
|
||||
return array_merge(
|
||||
|
||||
array(
|
||||
'<a href="' . admin_url( 'options-general.php?page=svg-support' ) . '" title="' . __( 'SVG Support Settings', 'svg-support' ) . '">' . __( 'Settings', 'svg-support') . '</a>'
|
||||
), $links
|
||||
);
|
||||
|
||||
return $links;
|
||||
|
||||
}
|
||||
add_filter( 'plugin_action_links_' . plugin_basename(BODHI_SVGS_PLUGIN_FILE), 'bodhi_svgs_plugin_action_links' );
|
||||
|
||||
/**
|
||||
* Add plugin_row_meta links
|
||||
*/
|
||||
function bodhi_svgs_plugin_meta_links( $links, $file ) {
|
||||
|
||||
if ( $file == plugin_basename(BODHI_SVGS_PLUGIN_FILE) ) {
|
||||
return array_merge(
|
||||
$links,
|
||||
array(
|
||||
'<a target="_blank" href="https://wordpress.org/support/plugin/svg-support">' . __( 'Get Support', 'svg-support') . '</a>',
|
||||
'<a target="_blank" href="https://wordpress.org/support/plugin/svg-support/reviews/">' . __( 'Leave a Review', 'svg-support' ) . '</a>',
|
||||
'<a target="_blank" href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=Z9R7JERS82EQQ&source=url">' . __( 'Donate to author', 'svg-support') . '</a>'
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
return $links;
|
||||
|
||||
}
|
||||
add_filter( 'plugin_row_meta', 'bodhi_svgs_plugin_meta_links', 10, 2 );
|
||||
160
wp-content/plugins/svg-support/admin/svgs-settings-page-help.php
Normal file
160
wp-content/plugins/svg-support/admin/svgs-settings-page-help.php
Normal file
@@ -0,0 +1,160 @@
|
||||
<?php
|
||||
/**
|
||||
* Add SVG Support help tab to the top of the settings page
|
||||
*/
|
||||
if ( ! defined( 'ABSPATH' ) ) {
|
||||
exit; // Exit if accessed directly
|
||||
}
|
||||
|
||||
function bodhi_svgs_help_tab () {
|
||||
|
||||
$screen = get_current_screen();
|
||||
|
||||
/**
|
||||
* Overview Tab
|
||||
*/
|
||||
// overview tab content
|
||||
$bodhi_svgs_help_tab_overview = '<h3>' . __( 'Overview', 'svg-support' ) . '</h3>';
|
||||
|
||||
$bodhi_svgs_help_tab_overview .= '<p>' . __( 'At it\'s core, SVG Support allows you to upload SVG files and use them as you would any regular image with the added benefit of being scalable and looking great on any screen size, no matter what size it\'s displayed. Additionally, SVG file sizes are (more often than not) much smaller than conventional image formats.', 'svg-support' ) . '</p><p>' . __( 'Even this most basic of usage is very powerful for modern websites, however, there\'s lots of cool stuff you can do with SVG files!', 'svg-support' ) . '</p><p>' . __( 'SVG Support features an "Advanced Mode" which toggles extra features, allowing you to take more control of how your SVG files are used. By rendering SVG files inline, it opens up a huge number of possibilities including animations, embedded links within the SVG, odd shaped link areas, custom CSS targeting elements within the SVG and whole lot more!', 'svg-support' ) . '</p><p>' . __( 'So let\'s get into some more details! Simply click the tabs to the left to get more of an understanding of how powerful SVG Support is.', 'svg-support' ) . '</p>';
|
||||
|
||||
// register overview tab
|
||||
$screen->add_help_tab( array(
|
||||
'id' => 'bodhi_svgs_help_tab-overview',
|
||||
'title' => __( 'Overview', 'svg-support' ),
|
||||
'content' => $bodhi_svgs_help_tab_overview
|
||||
));
|
||||
|
||||
/**
|
||||
* The Settings Tab
|
||||
*/
|
||||
// the settings tab content
|
||||
$bodhi_svgs_help_tab_the_settings = '<h3>' . __( 'The Settings', 'svg-support' ) . '</h3>';
|
||||
|
||||
$bodhi_svgs_help_tab_the_settings .= '<p><strong>' . __( 'Restrict To Administrators:', 'svg-support' ) . '</strong><br>' . __( 'SVG files are actually XML code, so allowing regular users to upload them can pose serious security risks. Please leave this checked unless you really know what you\'re doing.', 'svg-support' ) . '</p>';
|
||||
|
||||
$bodhi_svgs_help_tab_the_settings .= '<p><strong>' . __( 'Enable Advanced Mode:', 'svg-support' ) . '</strong><br>' . __( 'When using SVG files like regular images just isn\'t enough ;)', 'svg-support' ) . '<br>' . __( 'Enabling "Advanced Mode" displays options to give you more control over how you use SVG files on your site. It also includes extra JS on the front end, so leave this disabled unless you\'re actually using any of the advanced features.', 'svg-support' ) . '</p>';
|
||||
|
||||
$bodhi_svgs_help_tab_the_settings .= '<p><strong>' . __( 'Output JS in Footer:', 'svg-support' ) . '</strong><br>' . __( 'This setting allows you to choose whether the SVG Support JS file is enqueued in the header or the footer of the site. Usually you would enqueue in the footer unless you need it to be loaded sooner for some reason.', 'svg-support' ) . '</p>';
|
||||
|
||||
$bodhi_svgs_help_tab_the_settings .= '<p><strong>' . __( 'Use Expanded JS:', 'svg-support' ) . '</strong><br>' . __( 'This setting gives you the choice of JS file that is enqueued, the full expanded version or the minified version. You would usually enqueue the minified version, but if you want to bundle the JS file using a caching or minification plugin or similar, then you might want to enqueue the expanded, non-minified version.', 'svg-support' ) . '</p>';
|
||||
|
||||
$bodhi_svgs_help_tab_the_settings .= '<p><strong>' . __( 'CSS Class To Target:', 'svg-support' ) . '</strong><br>' . __( 'This allows you to set your own custom class that you will use in your SVG source IMG tags that you would like rendered inline. For example, it might be easier for you to remember to add the class "inline-svg" or something, in which case you would use your desired class name in this field to be used across your site.', 'svg-support' ) . '</p>';
|
||||
|
||||
$bodhi_svgs_help_tab_the_settings .= '<p><strong>' . __( 'Automatically Insert Class:', 'svg-support' ) . '</strong><br>' . __( 'When this is checked, you won\'t have to add the class to your SVG files during the embed process in the editor. When you pick your SVG, it will be placed in the editor with just the SVG Support class and others stripped. It does not change existing code, it\'s only a helper to allow you to quickly embed your SVG files and have them render inline without having to fiddle with the classes.', 'svg-support' ) . '</p>';
|
||||
|
||||
$bodhi_svgs_help_tab_the_settings .= '<p><strong>' . __( 'Force Inline SVG:', 'svg-support' ) . '</strong><br>' . __( 'This feature is to force all SVG files that are found in your site to be rendered inline. This can help if you aren\'t able to set a custom class on your IMG tags for some reason, usually when used in theme options or page builder elements.', 'svg-support' ) . '</p>';
|
||||
|
||||
// register the settings tab
|
||||
$screen->add_help_tab( array(
|
||||
'id' => 'bodhi_svgs_help_tab-the_settings',
|
||||
'title' => __( 'The Settings', 'svg-support' ),
|
||||
'content' => $bodhi_svgs_help_tab_the_settings
|
||||
));
|
||||
|
||||
/**
|
||||
* Standard Usage Tab
|
||||
*/
|
||||
// standard usage tab content
|
||||
$bodhi_svgs_help_tab_usage_standard = '<h3>' . __( 'Standard Usage', 'svg-support' ) . '</h3>';
|
||||
|
||||
$bodhi_svgs_help_tab_usage_standard .= '<p>' . __( 'You can simply upload SVG files to your media library like any other image.<br>Make sure to select "Restrict to Administrators" if you only want to allow admins to upload SVG files.', 'svg-support' ) . '</p>';
|
||||
|
||||
$bodhi_svgs_help_tab_usage_standard .= '<p>' . __( 'If you want to enable sanitization or minification of uploaded SVG files, please enable advanced settings and then enable sanitization and/or minification.', 'svg-support' ) . '</p>';
|
||||
|
||||
// register standard usage tab
|
||||
$screen->add_help_tab( array(
|
||||
'id' => 'bodhi_svgs_help_tab_usage-standard',
|
||||
'title' => __( 'Standard Usage', 'svg-support' ),
|
||||
'content' => $bodhi_svgs_help_tab_usage_standard
|
||||
));
|
||||
|
||||
/**
|
||||
* Inline SVG Tab
|
||||
*/
|
||||
// inline SVG tab content
|
||||
$bodhi_svgs_help_tab_inlining_svg = '<h3>' . __( 'Render SVG Inline', 'svg-support' ) . '</h3>';
|
||||
|
||||
$bodhi_svgs_help_tab_inlining_svg .= '<p>' . __( 'You can embed your SVG image like any standard image with the addition of adding the class <code>style-svg</code> (or your custom class) to any IMG tags that you want this plugin to swap out with your actual SVG code.', 'svg-support' ) . '<br>' . __( 'For example:', 'svg-support' ) . '</p>';
|
||||
|
||||
$bodhi_svgs_help_tab_inlining_svg .= '<pre><code><img class="style-svg" alt="alt-text" src="image-source.svg" /></code></pre>' . __( 'or', 'svg-support' ) . '<pre><code><img class="your-custom-class" alt="alt-text" src="image-source.svg" /></code></pre>';
|
||||
|
||||
$bodhi_svgs_help_tab_inlining_svg .= '<p>' . __( 'The whole IMG tag element will now be dynamically replaced by the actual code of your SVG, making the inner content targetable.', 'svg-support' ) . '<br>' . __( 'This allows you to target elements within your SVG using CSS.', 'svg-support' ) . '</p>';
|
||||
|
||||
$bodhi_svgs_help_tab_inlining_svg .= '<p><em>' . __( 'Please Note:', 'svg-support' ) . '</em><br><em>- ' . __( 'You will likely need to set your own height and width in your CSS for SVG files to display correctly.', 'svg-support' ) . '</em><br><em>- ' . __( 'Your uploaded image needs to be an SVG file for this plugin to replace the img tag with the inline SVG code. It will not create SVG files for you.', 'svg-support' ) . '</em><br><em>- ' . __( 'You can set this target class on any element and the script will traverse all children of that target element looking for IMG tags with SVG in the src to replace.', 'svg-support' ) . '</em></p>';
|
||||
|
||||
// register inline SVG tab
|
||||
$screen->add_help_tab( array(
|
||||
'id' => 'bodhi_svgs_help_tab-inlining_svg',
|
||||
'title' => __( 'Render SVG Inline', 'svg-support' ),
|
||||
'content' => $bodhi_svgs_help_tab_inlining_svg
|
||||
));
|
||||
|
||||
/**
|
||||
* Featured Images Tab
|
||||
*/
|
||||
// featured images tab content
|
||||
$bodhi_svgs_help_tab_featured_images = '<h3>' . __( 'Featured Images', 'svg-support' ) . '</h3>';
|
||||
|
||||
$bodhi_svgs_help_tab_featured_images .= '<p>' . __( 'You can use SVG files as featured images just like any other image format, with the addition of being able to render your featured SVG inline on a per-post basis.', 'svg-support' ) . '</p>';
|
||||
|
||||
$bodhi_svgs_help_tab_featured_images .= '<p>' . __( 'To render your featured SVG inline:', 'svg-support' ) . '</p>';
|
||||
|
||||
$bodhi_svgs_help_tab_featured_images .= '<ol><li>' . __( 'Make sure "Advanced Mode" is enabled.', 'svg-support' ) . '</li><li>' . __( 'Add your featured SVG like you would any regular featured image format.', 'svg-support' ) . '</li><li>' . __( 'Publish, Save Draft, or Update the post.', 'svg-support' ) . '</li><li>' . __( 'Once the screen reloads, click the new checkbox below the featured image to render your SVG inline.', 'svg-support' ) . '</li><li>' . __( 'Publish, Save Draft, or Update the post a final time to render the SVG inline.', 'svg-support' ) . '</li></ol>';
|
||||
|
||||
// register featured images tab
|
||||
$screen->add_help_tab( array(
|
||||
'id' => 'bodhi_svgs_help_tab-featured_images',
|
||||
'title' => __( 'Featured Images', 'svg-support' ),
|
||||
'content' => $bodhi_svgs_help_tab_featured_images
|
||||
));
|
||||
|
||||
/**
|
||||
* Animation Tab
|
||||
*/
|
||||
$bodhi_svgs_help_tab_animation = '<h3>' . __( 'Animation', 'svg-support' ) . '</h3>';
|
||||
|
||||
$bodhi_svgs_help_tab_animation .= '<p>' . __( 'So you want to animate your SVG?', 'svg-support' ) . '<br>' . __( 'There\'s a number of ways you can animate an SVG. You could use CSS or JS to target elements within your SVG or even embed the animations in the file itself. Whichever way you choose, there is always a little bit of preparation required before uploading your SVG to your media library.', 'svg-support' ) . '</p>';
|
||||
|
||||
$bodhi_svgs_help_tab_animation .= '<p><strong>' . __( 'First, let\'s talk about using CSS or JS to target elements within your SVG.', 'svg-support' ) . '</strong><br>' . __( 'Before you upload your SVG, you\'re going to need some classes to target inside your SVG. To do this, open your SVG file in the code editor of choice (I use Sublime Text). You will see each element within your SVG file written in XML code. Each little part of your SVG has it\'s own bit of code, so it\'s up to you which ones you want to target. It\'s in here that you\'ll place your new classes on each element you want to target.', 'svg-support' ) . '</p>';
|
||||
|
||||
$bodhi_svgs_help_tab_animation .= '<p>' . __( 'Then there\'s the option of animating the SVG file itself. There is a number of online tools to do this, or you can use the software of your choice. Once your SVG is animated and ready to go, you then upload it like any other image to your WordPress media library. When you embed it on a page/post, you will need to make sure to add the class to the IMG tag so SVG Support can render it inline. This will ensure your animations are displayed.', 'svg-support' ) . '</p>';
|
||||
|
||||
// register animation tab
|
||||
$screen->add_help_tab( array(
|
||||
'id' => 'bodhi_svgs_help_tab-animation',
|
||||
'title' => __( 'Animation', 'svg-support' ),
|
||||
'content' => $bodhi_svgs_help_tab_animation
|
||||
));
|
||||
|
||||
/**
|
||||
* DONATIONS Tab
|
||||
*/
|
||||
// donations tab content
|
||||
$bodhi_svgs_help_tab_donations = '<h3>' . __( 'Donations', 'svg-support' ) . '</h3>';
|
||||
|
||||
$bodhi_svgs_help_tab_donations .= '<p>' . __( 'SVG Support (this plugin) has grown to be used by over 1 million websites actively and is maintained solely by one person. I couldn\'t possibly tell you how many hours have gone into the development, maintenance and support of this plugin. If you find it useful and would like to donate to help keep it going, that would be amazing! I truly appreciate the support and how far this has come.', 'svg-support' ) . '</p>';
|
||||
|
||||
$bodhi_svgs_help_tab_donations .= '<p><strong>' . __( 'Donation Methods:', 'svg-support' ) . '</strong></p>';
|
||||
|
||||
$bodhi_svgs_help_tab_donations .= '<p><strong>' . __( 'PayPal: ', 'svg-support' ) . '</strong><a href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=Z9R7JERS82EQQ" target="_blank">Click Here</a><br/><strong>' . __( 'BTC: 1qF8r2HkTLifND7WLGfWmvxfXc9ze55DZ', 'svg-support' ) . '</strong><br/><strong>' . __( 'LTC: LUnQPJrSk6cVFmMqBMv5FAqweJbnzRUz4o', 'svg-support' ) . '</strong><br/><strong>' . __( 'ETH: 0x599695Eb51aFe2e5a0DAD60aD9c89Bc8f10B54f4', 'svg-support' ) . '</strong></p>';
|
||||
|
||||
$bodhi_svgs_help_tab_donations .= '<p>' . __( 'Need to buy some crypto to donate?', 'svg-support' ) . '</br>' . __( 'My Coinbase referral link will get $10 USD worth of BTC for free when you spend $100.', 'svg-support' ) . '</br>' . __( '(You don\'t need to send me that much though, anything is appreciated!)', 'svg-support' ) . '<br/><a href="https://www.coinbase.com/join/59be646cb87715012bbdcc6b" target="_blank">https://www.coinbase.com/join/59be646cb87715012bbdcc6b</a></p>';
|
||||
|
||||
// register featured images tab
|
||||
$screen->add_help_tab( array(
|
||||
'id' => 'bodhi_svgs_help_tab-donations',
|
||||
'title' => __( 'DONATIONS', 'svg-support' ),
|
||||
'content' => $bodhi_svgs_help_tab_donations
|
||||
));
|
||||
|
||||
/**
|
||||
* Help Tab Sidebar
|
||||
*/
|
||||
// add help tab sidebar
|
||||
$screen->set_help_sidebar(
|
||||
'<p><strong>' . __( 'For more help, visit:', 'svg-support' ) . '</strong></p>' .
|
||||
'<p>' . __( '<a target="_blank" href="https://wordpress.org/support/plugin/svg-support">SVG Support Forum</a>', 'svg-support' ) . '</p>'
|
||||
);
|
||||
|
||||
}
|
||||
503
wp-content/plugins/svg-support/admin/svgs-settings-page.php
Normal file
503
wp-content/plugins/svg-support/admin/svgs-settings-page.php
Normal file
@@ -0,0 +1,503 @@
|
||||
<?php
|
||||
/**
|
||||
* Settings Page Markup
|
||||
*/
|
||||
?>
|
||||
|
||||
<div class="wrap">
|
||||
|
||||
<div id="icon-upload" class="icon32"></div>
|
||||
<h2><?php esc_html_e( 'SVG Support Settings and Usage', 'svg-support' ); ?><span class="svgs-version">Version <?php echo esc_attr(BODHI_SVGS_VERSION); ?></span></h2>
|
||||
|
||||
<div id="poststuff">
|
||||
|
||||
<div class="meta-box-sortables ui-sortable">
|
||||
|
||||
<div class="postbox">
|
||||
|
||||
<h3><span><?php esc_html_e( 'Introduction', 'svg-support' ); ?></span></h3>
|
||||
<div class="inside">
|
||||
|
||||
<p>
|
||||
<?php esc_html_e( 'When using SVG images on your WordPress site, it can be hard to style elements within the SVG using CSS.', 'svg-support' ); ?>
|
||||
<strong><?php esc_html_e( 'Now you can, easily!', 'svg-support' ); ?></strong>
|
||||
</p>
|
||||
<p>
|
||||
<?php esc_html_e( 'When you enable advanced mode, this plugin not only provides SVG Support like the name says, it also allows you to easily embed your full SVG file\'s code using a simple IMG tag. By adding the class', 'svg-support' ); ?>
|
||||
<code><?php esc_html_e( 'style-svg', 'svg-support' ); ?></code>
|
||||
<?php esc_html_e( 'to your IMG elements, this plugin dynamically replaces any IMG elements containing the', 'svg-support' ); ?>
|
||||
<code><?php esc_html_e( 'style-svg', 'svg-support' ); ?></code>
|
||||
<?php esc_html_e( 'class with your complete SVG.', 'svg-support' ); ?>
|
||||
</p>
|
||||
<p>
|
||||
<?php esc_html_e( 'The main purpose of this is to allow styling of SVG elements. Usually your styling options are restricted when using', 'svg-support' ); ?>
|
||||
<code><?php esc_html_e( 'embed', 'svg-support' ); ?></code>,
|
||||
<code><?php esc_html_e( 'object', 'svg-support' ); ?></code>,
|
||||
<?php esc_html_e( 'or', 'svg-support' ); ?>
|
||||
<code><?php esc_html_e( 'img', 'svg-support' ); ?></code>
|
||||
<?php esc_html_e( 'tags alone.', 'svg-support' ); ?>
|
||||
</p>
|
||||
<p>
|
||||
<strong><?php esc_html_e( 'For help and more information, please check the help tab (top right of your screen).', 'svg-support' ); ?></strong>
|
||||
</p>
|
||||
|
||||
</div> <!-- .inside -->
|
||||
|
||||
</div> <!-- .postbox -->
|
||||
|
||||
</div> <!-- .meta-box-sortables .ui-sortable -->
|
||||
|
||||
<div class="meta-box-sortables ui-sortable">
|
||||
|
||||
<div class="postbox">
|
||||
|
||||
<h3><span><?php esc_html_e( 'Send Some Love', 'svg-support' ); ?></span></h3>
|
||||
<div class="inside">
|
||||
|
||||
<p><?php esc_html_e( 'SVG Support has grown to be installed on 1,000,000+ active websites. That\'s insane! It\'s developed and maintained by one person alone. If you find it useful, please consider donating to help keep it going. I truly appreciate any contribution.', 'svg-support' ); ?></p>
|
||||
<p><strong>
|
||||
<?php esc_html_e( 'BTC: 1qF8r2HkTLifND7WLGfWmvxfXc9ze55DZ', 'svg-support' ); ?><br/>
|
||||
<?php esc_html_e( 'ETH: 0x599695Eb51aFe2e5a0DAD60aD9c89Bc8f10B54f4', 'svg-support' ); ?>
|
||||
</strong></p>
|
||||
<p><?php esc_html_e( 'You can also', 'svg-support' ); ?> <a target="_blank" href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=Z9R7JERS82EQQ&source=url"><?php esc_html_e( 'Donate using PayPal', 'svg-support' ); ?></a></p>
|
||||
|
||||
</div> <!-- .inside -->
|
||||
|
||||
</div> <!-- .postbox -->
|
||||
|
||||
</div> <!-- .meta-box-sortables .ui-sortable -->
|
||||
|
||||
<div id="post-body" class="metabox-holder columns-2">
|
||||
|
||||
<!-- main content -->
|
||||
<div id="post-body-content">
|
||||
|
||||
<div class="meta-box-sortables ui-sortable">
|
||||
|
||||
<div class="postbox">
|
||||
|
||||
<h3><span><?php esc_html_e( 'Settings', 'svg-support' ); ?></span></h3>
|
||||
<div class="inside">
|
||||
|
||||
<form name="bodhi_svgs_settings_form" method="post" action="options.php">
|
||||
|
||||
<?php settings_fields('bodhi_svgs_settings_group'); ?>
|
||||
|
||||
<table class="form-table svg-settings">
|
||||
|
||||
<tr valign="top">
|
||||
<th scope="row">
|
||||
<strong><?php esc_html_e( 'Restrict SVG Uploads to?', 'svg-support' ); ?></strong>
|
||||
</th>
|
||||
<td>
|
||||
<div class="upload_allowed_roles">
|
||||
<?php $allowed_roles_array = $bodhi_svgs_options['restrict']; ?>
|
||||
<select style="display:none" name="bodhi_svgs_settings[restrict][]" multiple>
|
||||
<?php
|
||||
global $wp_roles;
|
||||
$all_roles = $wp_roles->roles;
|
||||
foreach ($all_roles as $role => $details) {
|
||||
$user_role_slug = esc_attr($role);
|
||||
$user_role_name = translate_user_role($details['name']);
|
||||
$role_selected = in_array($user_role_slug, $allowed_roles_array) ? 'selected' : '';
|
||||
?>
|
||||
<option value="<?php echo esc_attr($user_role_slug); ?>" <?php echo esc_attr($role_selected); ?>><?php echo esc_html($user_role_name); ?></option>
|
||||
<?php } ?>
|
||||
</select>
|
||||
</div>
|
||||
<small class="description"><?php esc_html_e('Select the user roles that are allowed to upload SVG files.', 'svg-support' ); ?></small>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr valign="top">
|
||||
<th scope="row">
|
||||
<strong><?php esc_html_e( 'Do not sanitize for these roles', 'svg-support' ); ?></strong>
|
||||
</th>
|
||||
<td>
|
||||
<div class="sanitize_on_upload_roles">
|
||||
<?php
|
||||
global $wp_roles;
|
||||
$all_roles = $wp_roles->roles; // Fetch all available roles
|
||||
$sanitize_roles_array = $bodhi_svgs_options['sanitize_on_upload_roles'];
|
||||
?>
|
||||
<select name="bodhi_svgs_settings[sanitize_on_upload_roles][]" multiple>
|
||||
<?php
|
||||
foreach ($all_roles as $role => $details) {
|
||||
$user_role_slug = esc_attr($role);
|
||||
$user_role_name = translate_user_role($details['name']);
|
||||
$role_selected = in_array($user_role_slug, $sanitize_roles_array) ? 'selected' : '';
|
||||
?>
|
||||
<option value="<?php echo esc_attr($user_role_slug); ?>" <?php echo esc_attr($role_selected); ?>><?php echo esc_html($user_role_name); ?></option>
|
||||
<?php } ?>
|
||||
</select>
|
||||
</div>
|
||||
<small class="description"><?php esc_html_e('Select the user roles that should bypass SVG sanitization.', 'svg-support' ); ?></small>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr valign="top">
|
||||
<th scope="row">
|
||||
<strong><?php esc_html_e( 'Sanitize SVG on Front-end', 'svg-support' ); ?></strong>
|
||||
</th>
|
||||
<td>
|
||||
<label for="bodhi_svgs_settings[sanitize_svg_front_end]">
|
||||
<input id="bodhi_svgs_settings[sanitize_svg_front_end]" name="bodhi_svgs_settings[sanitize_svg_front_end]" type="checkbox" <?php checked( $bodhi_svgs_options['sanitize_svg_front_end'], 'on' ); ?> />
|
||||
<?php esc_html_e( 'Yes', 'svg-support' ); ?><br /><small class="description"><?php esc_html_e('Enhance security by sanitizing svg images on Front-end. This will help to prevent XSS and Injection attacks.', 'svg-support' ); ?></small>
|
||||
</label>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr valign="top">
|
||||
<th scope="row">
|
||||
<label for="bodhi_svgs_settings[minify_svg]"><strong><?php esc_html_e( 'Minify SVG', 'svg-support' ); ?></strong>
|
||||
</th>
|
||||
<td>
|
||||
<label for="bodhi_svgs_settings[minify_svg]">
|
||||
<input id="bodhi_svgs_settings[minify_svg]" name="bodhi_svgs_settings[minify_svg]" type="checkbox" <?php checked( isset( $bodhi_svgs_options['minify_svg'] ), true ); ?> />
|
||||
<?php esc_html_e( 'Yes', 'svg-support' ); ?><br /><small class="description"><?php esc_html_e('Enabling this option will auto-minify all svg uploads.', 'svg-support' ); ?></small>
|
||||
</label>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr valign="top">
|
||||
<th scope="row">
|
||||
<strong><?php esc_html_e( 'Load frontend CSS?', 'svg-support' ); ?></strong>
|
||||
</th>
|
||||
<td>
|
||||
<label for="bodhi_svgs_settings[frontend_css]">
|
||||
<input id="bodhi_svgs_settings[frontend_css]" name="bodhi_svgs_settings[frontend_css]" type="checkbox" <?php checked( isset( $bodhi_svgs_options['frontend_css'] ), true ); ?> />
|
||||
<?php esc_html_e( 'Yes', 'svg-support' ); ?><br /><small class="description"><?php esc_html_e('A very small piece of code that helps with displaying SVGs on the frontend in some cases.', 'svg-support' ); ?></small>
|
||||
</label>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr valign="top">
|
||||
<th scope="row">
|
||||
<strong><?php esc_html_e( 'Enable Advanced Mode?', 'svg-support' ); ?></strong>
|
||||
</th>
|
||||
<td>
|
||||
<label for="bodhi_svgs_settings[advanced_mode]">
|
||||
<input id="bodhi_svgs_settings[advanced_mode]" name="bodhi_svgs_settings[advanced_mode]" type="checkbox" <?php checked( isset( $bodhi_svgs_options['advanced_mode'] ), true ); ?> />
|
||||
<?php esc_html_e( 'Yes', 'svg-support' ); ?><br /><small class="description"><?php esc_html_e('You don\'t need to enable this to simply use SVG files as images. Enabling this will trigger advanced options and SVG functionality such as inline rendering.', 'svg-support' ); ?></small>
|
||||
</label>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr valign="top" class="svgs-advanced">
|
||||
<th scope="row">
|
||||
<h3 class="inner-title"><?php esc_html_e( 'Advanced', 'svg-support' ); ?></h3>
|
||||
</th>
|
||||
<td>
|
||||
<hr>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr valign="top" class="svgs-advanced">
|
||||
<th scope="row">
|
||||
<strong><?php esc_html_e( 'CSS Class to target', 'svg-support' ); ?></strong>
|
||||
</th>
|
||||
<td>
|
||||
<label for="bodhi_svgs_settings[css_target]">
|
||||
<input id="bodhi_svgs_settings[css_target]" class="all-options code" name="bodhi_svgs_settings[css_target]" type="text" value="<?php echo isset( $bodhi_svgs_options['css_target'] ) ? esc_attr($bodhi_svgs_options['css_target']) : ''; ?>"><br />
|
||||
<small class="description">
|
||||
<?php esc_html_e( 'The default target class is', 'svg-support' ); ?>
|
||||
<code><?php echo esc_html( 'style-svg' ); ?></code>.
|
||||
<?php esc_html_e( 'You can change it to your own class such as', 'svg-support' ); ?>
|
||||
<code><?php echo esc_html( 'my-class' ); ?></code>
|
||||
<?php esc_html_e( 'by typing it here. Leave blank to use the default class.', 'svg-support' ); ?>
|
||||
<br>
|
||||
<em><?php esc_html_e( 'Plugin can now go any level down to find your SVG! It will keep looking as long as the element with the target class has children. If it finds any IMG tags with .svg in the src URL, it will replace the IMG tag with your SVG code.', 'svg-support' ); ?></em>
|
||||
</small>
|
||||
</label>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr valign="top" class="svgs-advanced">
|
||||
<th scope="row">
|
||||
<strong><?php esc_html_e( 'Skip Nested SVGs', 'svg-support' ); ?></strong>
|
||||
</th>
|
||||
<td>
|
||||
<label for="bodhi_svgs_settings[skip_nested_svg]">
|
||||
<input id="bodhi_svgs_settings[skip_nested_svg]" name="bodhi_svgs_settings[skip_nested_svg]" type="checkbox" value="1" <?php checked( isset( $bodhi_svgs_options['skip_nested_svg'] ) && $bodhi_svgs_options['skip_nested_svg'] == 1 ); ?> />
|
||||
<?php esc_html_e( 'Yes', 'svg-support' ); ?>
|
||||
<br><small class="description"><?php esc_html_e( 'When enabled, only the first SVG in a .style-svg container will be inlined. Useful for Gutenberg Cover blocks with nested SVG images.', 'svg-support' ); ?></small>
|
||||
</label>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr valign="top" class="svgs-advanced">
|
||||
<th scope="row">
|
||||
<strong><?php esc_html_e( 'Output JS in Footer?', 'svg-support' ); ?></strong>
|
||||
</th>
|
||||
<td>
|
||||
<label for="bodhi_svgs_settings[js_foot_choice]">
|
||||
<input id="bodhi_svgs_settings[js_foot_choice]" name="bodhi_svgs_settings[js_foot_choice]" type="checkbox" <?php checked( isset( $bodhi_svgs_options['js_foot_choice'] ), true ); ?> />
|
||||
<?php esc_html_e( 'Yes', 'svg-support' ); ?><br /><small class="description"><?php esc_html_e('Normally, scripts are placed in head of the HTML document. If "Yes" is selected, the script is placed before the closing body tag. This requires the theme to have the wp_footer() template tag in the appropriate place.', 'svg-support' ); ?></small>
|
||||
</label>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr valign="top" class="svgs-advanced">
|
||||
<th scope="row">
|
||||
<strong><?php esc_html_e( 'Use Vanilla JS?', 'svg-support' ); ?></strong>
|
||||
</th>
|
||||
<td>
|
||||
<label for="bodhi_svgs_settings[use_vanilla_js]">
|
||||
<input id="bodhi_svgs_settings[use_vanilla_js]" name="bodhi_svgs_settings[use_vanilla_js]" type="checkbox" <?php checked( isset( $bodhi_svgs_options['use_vanilla_js'] ), true ); ?> />
|
||||
<?php esc_html_e( 'Yes', 'svg-support' ); ?><br /><small class="description"><?php esc_html_e('Checking this will use vanilla JS file instead of the jQuery.', 'svg-support' ); ?></small>
|
||||
</label>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr valign="top" class="svgs-advanced">
|
||||
<th scope="row">
|
||||
<strong><?php esc_html_e( 'Use Expanded JS?', 'svg-support' ); ?></strong>
|
||||
</th>
|
||||
<td>
|
||||
<label for="bodhi_svgs_settings[use_expanded_js]">
|
||||
<input id="bodhi_svgs_settings[use_expanded_js]" name="bodhi_svgs_settings[use_expanded_js]" type="checkbox" <?php checked( isset( $bodhi_svgs_options['use_expanded_js'] ), true ); ?> />
|
||||
<?php esc_html_e( 'Yes', 'svg-support' ); ?><br /><small class="description"><?php esc_html_e('Checking this will use the expanded JS file instead of the minified JS file. Useful if you want to minify this externally using a caching plugin or similar.', 'svg-support' ); ?></small>
|
||||
</label>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr valign="top" class="svgs-advanced">
|
||||
<th scope="row">
|
||||
<h3 class="inner-title"><?php esc_html_e( 'Legacy Settings', 'svg-support' ); ?></h3>
|
||||
</th>
|
||||
<td>
|
||||
<hr>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr valign="top" class="svgs-advanced">
|
||||
<th scope="row">
|
||||
<strong><?php esc_html_e( 'Force Inline SVG?', 'svg-support' ); ?></strong></label>
|
||||
</th>
|
||||
<td>
|
||||
<label for="bodhi_svgs_settings[force_inline_svg]">
|
||||
<input id="bodhi_svgs_settings[force_inline_svg]" name="bodhi_svgs_settings[force_inline_svg]" type="checkbox" <?php checked( isset( $bodhi_svgs_options['force_inline_svg'] ), true ); ?> />
|
||||
<?php esc_html_e( 'Yes', 'svg-support' ); ?><br />
|
||||
<small class="description">
|
||||
<strong><?php esc_html_e( 'Use with caution!', 'svg-support' ); ?></strong>
|
||||
<?php esc_html_e( 'Checking this will automatically add the SVG class to ALL image tags containing SVG file sources in the rendered HTML via javascript and will therefore render all of your SVG files inline.', 'svg-support' ); ?>
|
||||
<br />
|
||||
<em><?php esc_html_e( 'Use case scenario: When using a visual builder such as in the Divi Theme or The Divi Builder, the class is not automatically added with the "Automatically insert class?" option selected or the builder module doesn\'t give you the option to manually add a CSS class directly to your image.', 'svg-support' ); ?></em>
|
||||
</small>
|
||||
</label>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr valign="top" class="svgs-advanced">
|
||||
<th scope="row">
|
||||
<strong><?php esc_html_e( 'Automatically insert class?', 'svg-support' ); ?></strong></label>
|
||||
</th>
|
||||
<td>
|
||||
<label for="bodhi_svgs_settings[auto_insert_class]">
|
||||
<input id="bodhi_svgs_settings[auto_insert_class]" name="bodhi_svgs_settings[auto_insert_class]" type="checkbox" <?php checked( isset( $bodhi_svgs_options['auto_insert_class'] ), true ); ?> />
|
||||
<?php esc_html_e( 'Yes', 'svg-support' ); ?><br />
|
||||
<small class="description">
|
||||
<?php esc_html_e('(Classic Editor Only) Checking this will make sure that either the default class or the custom one you set in "CSS Class to target" option will be inserted into the style attributes of img tags when you insert SVG images into a post. Additionally, it will remove all of the default WordPress classes. It will leave normal image types as default and only affect SVG files.', 'svg-support' ); ?>
|
||||
</small>
|
||||
</label>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
</table>
|
||||
|
||||
<div class="postbox">
|
||||
<h3><span><?php esc_html_e( 'Danger Zone', 'svg-support' ); ?></span></h3>
|
||||
<div class="inside">
|
||||
<table class="form-table">
|
||||
<tr valign="top">
|
||||
<th scope="row">
|
||||
<label for="bodhi_svgs_settings[del_plugin_data]"><strong><?php esc_html_e( 'Delete Plugin Data', 'svg-support' ); ?></strong></label>
|
||||
</th>
|
||||
<td>
|
||||
<label for="bodhi_svgs_settings[del_plugin_data]">
|
||||
<input id="bodhi_svgs_settings[del_plugin_data]" name="bodhi_svgs_settings[del_plugin_data]" type="checkbox" <?php checked( isset( $bodhi_svgs_options['del_plugin_data'] ), true ); ?> />
|
||||
<?php esc_html_e( 'Yes', 'svg-support' ); ?><br /><small class="description"><?php esc_html_e('Delete all plugin\'s data during uninstallation process.', 'svg-support' ); ?></small>
|
||||
</label>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p>
|
||||
<input class="button-primary" type="submit" name="bodhi_svgs_settings_submit" value="<?php esc_html_e( 'Save Changes', 'svg-support' ); ?>" />
|
||||
</p>
|
||||
|
||||
</form>
|
||||
|
||||
</div> <!-- .inside -->
|
||||
|
||||
</div> <!-- .postbox -->
|
||||
|
||||
<div class="postbox">
|
||||
|
||||
<?php
|
||||
|
||||
if ( empty( $bodhi_svgs_options['advanced_mode'] ) ) {
|
||||
echo '<h3><span>';
|
||||
esc_html_e( 'Usage', 'svg-support' );
|
||||
echo '</span></h3>';
|
||||
} else {
|
||||
echo '<h3><span>';
|
||||
esc_html_e( 'Advanced Usage', 'svg-support' );
|
||||
echo '</span></h3>';
|
||||
}
|
||||
|
||||
?>
|
||||
|
||||
<div class="inside">
|
||||
|
||||
<p><?php esc_html_e( 'You can simply upload SVG files to your media library like any other image. Make sure to select "Restrict to Administrators" if you only want to allow admins to upload SVG files.', 'svg-support' ); ?></p>
|
||||
|
||||
<div class="svgs-advanced">
|
||||
<p>
|
||||
<?php
|
||||
esc_html_e( 'Now, embed your SVG image like a standard image with the addition of adding the class', 'svg-support' );
|
||||
?>
|
||||
<code><?php echo esc_html( 'style-svg' ); ?></code>
|
||||
<?php
|
||||
esc_html_e( '(or your custom class from above) to any IMG tags that you want this plugin to swap out with your actual SVG code.', 'svg-support' );
|
||||
?>
|
||||
<br />
|
||||
<?php esc_html_e( 'You can even use the class on an outer container and it will traverse all child elements to find all of the IMG tags with SVG files in the src and replace them.', 'svg-support' ); ?>
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<?php esc_html_e( 'For example:', 'svg-support' ); ?>
|
||||
<pre><code><img class="style-svg" alt="alt-text" src="image-source.svg" /></code></pre>
|
||||
<?php esc_html_e( 'or', 'svg-support' ); ?>
|
||||
<pre><code><img class="your-custom-class" alt="alt-text" src="image-source.svg" /></code></pre>
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<?php esc_html_e( 'The whole IMG tag element will now be dynamically replaced by the actual code of your SVG, making the inner content targetable.', 'svg-support' ); ?><br />
|
||||
<?php esc_html_e( 'This allows you to target elements within your SVG using CSS.', 'svg-support' ); ?>
|
||||
</p>
|
||||
|
||||
<p><em><?php esc_html_e( 'Please Note:', 'svg-support' ); ?></em>
|
||||
<br><em><?php esc_html_e( '- You will need to set your own height and width in your CSS for SVG files to display correctly.', 'svg-support' ); ?></em>
|
||||
<br><em><?php esc_html_e( '- Your uploaded image needs to be an SVG file for this plugin to replace the img tag with the inline SVG code. It will not create SVG files for you.', 'svg-support' ); ?></em>
|
||||
<br><em><?php esc_html_e( '- You can set this target class on any element and the script will traverse all children of that target element looking for IMG tags with SVG in the src to replace.', 'svg-support' ); ?></em></p>
|
||||
</div>
|
||||
|
||||
</div> <!-- .inside -->
|
||||
|
||||
</div> <!-- .postbox -->
|
||||
|
||||
<div class="postbox">
|
||||
<h3><span><?php esc_html_e( 'Compress and Optimize Images with ShortPixel', 'svg-support' ); ?></span></h3>
|
||||
<div class="inside">
|
||||
<?php
|
||||
printf(
|
||||
'<a target="_blank" class="shortpixel-logo" href="https://shortpixel.com/h/af/OLKMLXE207471"><img src="%s" alt="%s" /></a>',
|
||||
esc_url(plugins_url('admin/img/shortpixel.png', BODHI_SVGS_PLUGIN_FILE)),
|
||||
esc_attr__('ShortPixel logo', 'svg-support')
|
||||
);
|
||||
?>
|
||||
<p><?php esc_html_e( 'Now that you\'ve set up SVG Support on your site, it\'s time to look at optimizing your existing images (jpg & png).', 'svg-support' ); ?></p>
|
||||
<p><?php esc_html_e( 'ShortPixel improves website performance by reducing the size of your images. The results are no different in quality from the original, plus your originals are stored in a backup folder for you.', 'svg-support' ); ?></p>
|
||||
<p><?php esc_html_e( 'If you upgrade to a paid plan, I\'ll receive a small commission... And that\'s really nice!', 'svg-support' ); ?></p>
|
||||
<p><a class="shortpixel-button button-primary" href="https://shortpixel.com/h/af/OLKMLXE207471"><?php esc_html_e( 'Try ShortPixel WordPress Plugin for FREE', 'svg-support' ); ?></a></p>
|
||||
</div> <!-- .inside -->
|
||||
</div> <!-- .postbox -->
|
||||
|
||||
<div class="postbox">
|
||||
<h3><span><?php esc_html_e( 'Animate and Optimize your SVG files using these open source projects', 'svg-support' ); ?></span></h3>
|
||||
<div class="inside">
|
||||
<p><a href="https://maxwellito.github.io/vivus-instant/" target="_blank">Vivus Instant for SVG animation</a> <?php esc_html_e( 'Upload your SVG files and use the tools provided to animate strokes.', 'svg-support' ); ?></p>
|
||||
<p><a href="https://jakearchibald.github.io/svgomg/" target="_blank">SVGOMG for SVG optimisation</a> <?php esc_html_e( 'An online tool to optimize your SVG files.', 'svg-support' ); ?></p>
|
||||
</div> <!-- .inside -->
|
||||
</div> <!-- .postbox -->
|
||||
|
||||
</div> <!-- .meta-box-sortables .ui-sortable -->
|
||||
|
||||
</div> <!-- post-body-content -->
|
||||
|
||||
<!-- sidebar -->
|
||||
<div id="postbox-container-1" class="postbox-container">
|
||||
|
||||
<div class="meta-box-sortables">
|
||||
|
||||
<div class="postbox">
|
||||
<h3><span><?php esc_html_e( 'Ratings & Reviews', 'svg-support' ); ?></span></h3>
|
||||
<div class="inside">
|
||||
<p>
|
||||
<?php esc_html_e( 'If you like', 'svg-support' ); ?>
|
||||
<strong><?php esc_html_e( 'SVG Support', 'svg-support' ); ?></strong>
|
||||
<?php esc_html_e( 'please consider leaving a', 'svg-support' ); ?>
|
||||
<a href="https://wordpress.org/support/view/plugin-reviews/svg-support?filter=5#postform" target="_blank" class="svgs-rating-link">★★★★★</a>
|
||||
<?php esc_html_e( 'rating.', 'svg-support' ); ?>
|
||||
<br />
|
||||
<?php esc_html_e( 'A huge thanks in advance!', 'svg-support' ); ?>
|
||||
</p>
|
||||
<p><a href="https://wordpress.org/support/view/plugin-reviews/svg-support?filter=5#postform" target="_blank" class="button-primary">Leave a rating</a></p>
|
||||
</div> <!-- .inside -->
|
||||
</div> <!-- .postbox -->
|
||||
|
||||
<div class="postbox">
|
||||
<h3><span><?php esc_html_e( 'Having Issues?', 'svg-support' ); ?></span></h3>
|
||||
<div class="inside">
|
||||
<p><?php esc_html_e( 'I\'m always happy to help out!', 'svg-support' ); ?>
|
||||
<br><?php esc_html_e( 'Support is handled exclusively through WordPress.org by my one man team - me.', 'svg-support' ); ?></p>
|
||||
<p><a href="https://wordpress.org/support/plugin/svg-support/" target="_blank" class="button-primary"><?php esc_html_e('Get Support', 'svg-support'); ?></a></p>
|
||||
</div> <!-- .inside -->
|
||||
</div> <!-- .postbox -->
|
||||
|
||||
<div class="postbox">
|
||||
<h3><span><?php esc_html_e( 'SVG Support Features', 'svg-support' ); ?></span></h3>
|
||||
<div class="inside">
|
||||
<ul>
|
||||
<li><strong><?php esc_html_e( 'Basic Use', 'svg-support' ); ?></strong></li>
|
||||
<li><?php esc_html_e( 'SVG Support for your media library', 'svg-support' ); ?></li>
|
||||
<li><?php esc_html_e( 'Restrict to Administrators only', 'svg-support' ); ?></li>
|
||||
<hr>
|
||||
<li><strong><?php esc_html_e( 'Advanced Mode', 'svg-support' ); ?></strong></li>
|
||||
<li><?php esc_html_e( 'Sanitize SVG files on upload', 'svg-support' ); ?></li>
|
||||
<li><?php esc_html_e( 'Style SVG elements using CSS', 'svg-support' ); ?></li>
|
||||
<li><?php esc_html_e( 'Animate SVG using CSS or JS', 'svg-support' ); ?></li>
|
||||
<li><?php esc_html_e( 'Include multiple URLs inside single SVG', 'svg-support' ); ?></li>
|
||||
<li><?php esc_html_e( 'Use odd shapes as links', 'svg-support' ); ?></li>
|
||||
<li><?php esc_html_e( 'Inline SVG featured image support', 'svg-support' ); ?></li>
|
||||
<li><?php esc_html_e( 'Force all SVG files to be rendered inline', 'svg-support' ); ?></li>
|
||||
</ul>
|
||||
</div> <!-- .inside -->
|
||||
</div> <!-- .postbox -->
|
||||
|
||||
<div class="postbox">
|
||||
<h3><span><?php esc_html_e( 'About The Plugin', 'svg-support' ); ?></span></h3>
|
||||
<div class="inside">
|
||||
<p><?php esc_html_e( 'Learn more about SVG Support on:', 'svg-support' ); ?><br/><a target="_blank" href="http://wordpress.org/plugins/svg-support/"><?php esc_html_e( 'The WordPress Plugin Repository', 'svg-support' ); ?></a></p>
|
||||
<p><?php esc_html_e( 'Need help?', 'svg-support' ); ?><br/><a target="_blank" href="http://wordpress.org/support/plugin/svg-support"><?php esc_html_e( 'Visit The Support Forum', 'svg-support' ); ?></a></p>
|
||||
<p>
|
||||
<?php esc_html_e( 'Follow', 'svg-support' ); ?>
|
||||
<a target="_blank" href="https://twitter.com/svgsupport"><?php esc_html_e( '@SVGSupport', 'svg-support' ); ?></a>
|
||||
<?php esc_html_e( 'on Twitter', 'svg-support' ); ?>
|
||||
</p>
|
||||
<p>
|
||||
<?php esc_html_e( 'Follow Benbodhi on:', 'svg-support' ); ?><br/>
|
||||
<a target="_blank" href="https://twitter.com/benbodhi"><?php esc_html_e( 'Twitter', 'svg-support' ); ?></a> |
|
||||
<a target="_blank" href="https://warpcast.com/benbodhi"><?php esc_html_e( 'Warpcast', 'svg-support' ); ?></a>
|
||||
</p>
|
||||
<p>© <?php esc_html_e( 'Benbodhi', 'svg-support' ); ?> | <a target="_blank" href="https://benbodhi.com/">Benbodhi.com</a></p>
|
||||
<p>
|
||||
<?php esc_html_e( 'Thanks for your support, please consider donating.', 'svg-support' ); ?><br/>
|
||||
<a target="_blank" href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=Z9R7JERS82EQQ&source=url"><?php esc_html_e( 'Donate using PayPal', 'svg-support' ); ?></a>
|
||||
</p>
|
||||
</div> <!-- .inside -->
|
||||
</div> <!-- .postbox -->
|
||||
|
||||
</div> <!-- .meta-box-sortables -->
|
||||
|
||||
</div> <!-- #postbox-container-1 .postbox-container -->
|
||||
|
||||
</div> <!-- #post-body .metabox-holder .columns-2 -->
|
||||
|
||||
<br class="clear">
|
||||
</div> <!-- #poststuff -->
|
||||
|
||||
</div> <!-- .wrap -->
|
||||
Reference in New Issue
Block a user