Wordpress select and crop in plugin - wordpress

I needs to upload images in my plugin and use wp.media for this task.
According to https://codex.wordpress.org/Javascript_Reference/wp.media
Its work, but I needs to have "Select and Crop" option in media library after upload my image with custom size.
I was see this in default theme in appearence custom header image, but can't understand how I can use this in my plugin with wp.media js?

This my not be better solution but work in wordpress :)
i use Thumbnail Crop Position and Simple Image Sizes for that :)
Good luck! :)
<?php if ( has_post_thumbnail() ) {
the_post_thumbnail('yourImageSize');
}?>

See my answer posted here that does Select and Crop using the Media Library on a theme options page. You can use it as a starting point for getting it to work in a plugin:
https://wordpress.stackexchange.com/questions/281760/using-media-uploader-to-select-image-of-specific-size-enforce-cropper/302962#302962

Related

Adding Styling to WooCommerce drop down?

Not sure if styling (CSS) is possible w/ this php code, but if anyone knows how i can style this ( with colors, etc) please let me know! this is the basic WooCommerce drop-down code that's placed in my template files
<?php the_widget( 'WC_Widget_Product_Categories', 'dropdown=1' ); ?>
Using Plugin :
https://wordpress.org/plugins/widget-css-classes/
Please note that this plugin doesn't enable you to enter custom CSS. You'll need to edit your theme's style.css or add another plugin that allows you to input custom CSS.
Refer this for full article
http://www.wpbeginner.com/wp-themes/how-to-add-custom-styles-to-wordpress-widgets/

Create mobile navigation header in WordPress with custom settings

I'm trying to figure out how to create a header in WordPress that only shows for mobile devices, and how to modify properties of that header from the dashboard settings area.
I'm assuming I should be using the wp_is_mobile(); function to test for mobile. I'm just a bit green on how to implement this in WordPress. My main questions are as follows:
I believe I need to hook into the wp_head or activate_wp_head action
hook, is this correct?
I want to set colors for background and font colors in the dashboard
settings area. How do I go about doing this?
Is this a plugin? Is it a function? This question is about the
terminology I should be using.
Final question, where should I put this code? I'm sure it depends on
a couple of the previous answers, which is why I asked it last.
Thanks for the help. I don't need specific code I just need to be pointed in the right direction.
You should be able to accomplish what you're looking for in terms of the mobile specific header by replacing:
<?php get_header(); ?>
with this:
<?php
if ( wp_is_mobile() ) :
get_header( 'mobile' );
else :
get_header();
endif;
?>
in the file that you want to have a mobile specific header. You'll need to create your custom header in header-mobile.php in your theme's directory.
Read more about get_header() at the WordPress Codex here: http://codex.wordpress.org/Function_Reference/get_header. Read more about wp_is_mobile() at the WordPress Codex here: http://codex.wordpress.org/Function_Reference/wp_is_mobile.
In terms of using the Theme Customization API, which allows you to set colors for background and font colors in the wp-admin, I recommend reading up at the WordPress Codex here: http://codex.wordpress.org/Theme_Customization_API
For the Theme Customization API, you should add that code in your functions.php file.
The correct terminology is entirely dependant upon what you're doing, but it sounds like you just need to write a few functions, no plugin needed.
Hope this helps!
I think U should use #media, for example:
#media (max-width: 767px) {
.menu {
margin-left: 0;
height: 100px;
}

Youtube dimensions wordpress

Is it possible to change the default embed dimensions of an youtube (or another video) in Wordpress for your current theme? I've searched for a plugin and some code, but I can't seem to find any.
What I mean is the default embed size used when you just paste an youtube url in an post or page.
Open your theme’s functions.php file, and add the following code:
if ( ! isset( $content_width ) ) $content_width = 600;
Remember to change the number 600 appropriately for your theme. It is the maximum width in pixels for your content area.
Once you do this, WordPress will automatically use that for the maximum width of your oEmbed elements (youtube videos, slideshare, etc).
via wpbeginner.com
The media settings have been removed. You can do it with a filter however.
function mycustom_embed_defaults($embed_size){
$embed_size['width'] = 600; // Adjust values to your needs
$embed_size['height'] = 500;
return $embed_size; // Return new size
}
add_filter('embed_defaults', 'mycustom_embed_defaults');
Taken from here http://shailan.com/2154/change-wordpress-default-embed-size-using-filters/
The currently accepted answer has an example that uses the following shortcode:
[youtube=http://www.youtube.com/watch?v=0Bmhjf0rKe8&w=640&h=385]
The shortcode [youtube] only works if you have the Jetpack plugin installed.
To make it work with WordPress with no Jetpack you can use the built-in [embed] shortcode like this:
[embed width=640 height=385]http://www.youtube.com/watch?v=0Bmhjf0rKe8[/embed]
To change the default embed size go to Settings > Media and just set a fixed width/height.
You also have the shortcode
[youtube=http://www.youtube.com/watch?v=0Bmhjf0rKe8&w=640&h=385]
where you can manually insert width and height as params. This shortcode will overwrite the default WP settings.
They've got rid of the fixed width/height option in the media settings of the new version of Wordpress. Not sure why. It was useful!! Shortcodes don't seem to work either.

the_post_thumbnail(array(X,Y)) doesn't work well

The size of my posts’ featured images is 700x400 or more, and in order to display them center-cropped to 300x400 I use :
the_post_thumbnail(array(300,400));
However this code displays everything except a 300x400 image. Anybody could tell me how to achieve what I want ?
As the function manual says:-
PLEASE NOTE: The crop does not work in
Wp 3.0+. All that is needed for WP
3.0+ is the call for the thumbnail to post. Then proceed to media in the
dashboard and set your thumbnail to
crop to the size you wish to use.
http://codex.wordpress.org/Function_Reference/the_post_thumbnail
See here: http://gavinsmith.me/2010/10/multiple-post-thumbnail-featured-image-sizes-in-wordpress/
You can dig a bit further than using only the_post_thumbnail and actually create your own image sizes. Then, using the_post_thumbnail, you can call the image - but the version you have created using add_image_size, as described on that page. Let me know if I lost you there.
try out this
<?php echo the_post_thumbnail(array(32,32)); ?>
You can Increase size on desire

How would you recommend adding an image as a custom field in WordPress?

I need to add an image to each page in WordPress.
I don't wish to insert it using the WYSIWYG editor, I just need the url as a custom field, which I later use in the template.
I tried using the CFI plugin (Custom Field Images), and I hacked my way into getting it to work with the rest of my plugins, but then I moved the site to the production server and CFI just didn't work for some reason.
I can't seem to find any other plugin that just lets you pick an image from the library and add it as a custom field.
I've downgraded to the point where I'm willing to manually enter all the URLs into each and every page. but before I do, I thought I'd check here.
Can anyone tell me what's the easiest, best way to add images as custom fields in WordPress (2.7.1 if it matters)?
In our WordPress template, each post generally only has one image 'attached', which is displayed outside the posts' (textual) content.
I simply upload the file using the edit posts' media uploader, never insert it into the post like JoshJordan above, then retrieve the image using a bit of code in the right place in my template file.
This would also work if you're using more than one image in your post, eg. in your post content. As long as you keep the image used as the 'main' post image as the first image (remember you can re-order images in your posts' image library by dragging them up and down), you're easily able to call it anywhere in your template file by using something like this:
<?php
$img_size = 'thumbnail'; // use thumbnail, medium, large, original
$img_id = $wpdb->get_var("SELECT ID FROM $wpdb->posts where post_parent= $post->ID and (post_mime_type = 'image/jpeg' OR post_mime_type = 'image/gif') and post_type = 'attachment'");
$img_array = wp_get_attachment_image_src($img_id,$img_size,false);
echo '<img src="'.$img_array[0].'"' title="'.get_the_title().'" />';
?>
No need for copying and pasting image urls.
The template I have uses a manually-entered custom field for the splash image of each post. When I'm done writing my article, I upload an image, copy its URL from the upload tool, never insert it into my post, and then paste that URL into the "Image" custom field. Simple as pie and takes only seconds. Insignificant compared to the amount of time it takes me to write an article.
You can use the custom key value fields on posts as well. let's say you always give your images the key 'thumb'. you can then use this code to output them in your post as a thumbnail:
<?php
$values = get_post_custom_values("thumb");
echo “<img src=\”$values[0]\” class=\”thumb\”></a>”; ?>
Consider using Flutter it's a bit tricky to figure out at first, and has many really useful featured, including EIP (edit in place), and image handling.
After installing the plugin create a new "Write Panel", you'll figure it out from there. The plugin provides you with a rather intuitive GUI, which includes an image uploader. The template tags are very easy to use, I believe it's something like
<?php echo get_image('name_of_field'); ?>
I just had to build a site for a client that needed the same feature, I ended up using Flutter.

Resources