Outputs links which are images, with floting-over captions and changing images.\nEasily lets you disable the styles (and Scripts) so you can write your own styles.<\/p>\n\n
Note there are no screens added to your dashboard - all the settings\/information\nis in this readme.txt file.<\/p>\n\n
Here's an example of a bunch of image links wrapped in an image link grid. The grid is optional and just makes the image links sit in columns instead of always being full width.<\/p>\n\n
Be careful when using image_link_grid that there is no other markup included - watch out for text-editor line breaks being turned into paragraph or line-break tags. You're probably best editing the shortcode data in Text and not Visual view.<\/p>\n\n
[mha_image_link_grid columns_xs=2 columns_md=2]\n [mha_image_link attachment=100 link=\"\/contact-us\" text=\"Contact Us!\" subtext=\"Get in touch now!\"]\n [mha_image_link attachment=101 link=\"https:\/\/www.example.com\" text=\"Checkout Example\"]\n [mha_image_link attachment=102 link=\"\/some-page\" text=\"This is some page\"]\n [mha_image_link attachment=102 link=\"\/some-page\" text=\"This is some page\" style=\"full\"]\n [mha_image_link image=\"\/path-to\/image.png\" link=\"\/another_page\" text=\"This is another page\"]\n [mha_image_link image=\"https:\/\/www.example.com\/remote-image.png\" link=\"\/another_page\"]\n[\/mha_image_link_grid] \n<\/code><\/pre>\n\nDocumentation<\/h3>\n\n
No screens or options are added to your Dashboard. All customising needs to be done in your theme's CSS file.<\/p>\n\n
Image links Javascript<\/h3>\n\n
The JavaScript enables multiple images on each image link. If you're not using that functionlaity, or want to implement it yourself - you can stop the JavaScript file being included with:<\/p>\n\n
<?php\n add_filter( 'mha_image_link_include_scripts', '__return_false' );\n?>\n<\/code><\/pre>\n\nThe handle of the script is mha-image-links<\/code>.<\/p>\n\nImage links CSS<\/h3>\n\n
To stop the plugin including it's default CSS file use this filter:<\/p>\n\n
<?php\n add_filter( 'mha_image_link_include_styles', '__return_false' );\n?>\n<\/code><\/pre>\n\nThe handle of the styles is mha-image-links<\/code><\/p>\n\n[mha_image_link_grid] shortcode settings<\/h3>\n\n\ncolumns_xs<\/strong> Default: 2<\/em>\nSpecify hwo many columns should display on extra small devices. By default that's anything up to 768px. Valid values are 1, 2, 3 or 4 unless you add more code based on the source in image-links.scss<\/code><\/p><\/li>\ncolumns_sm<\/strong> Default: none<\/em>\nThe same as columns_xs but for small screens (above 768px). If not set then this will default to the value of columns_xs<\/p><\/li>\ncolumns_md<\/strong> Default: none<\/em>\nThe same as columns_sm but for small screens (above 992px). If not set then this will default to the value of columns_sm<\/p><\/li>\ncolumns_lg<\/strong> Default: none<\/em>\nThe same as columns_md but for large screens (above 1200px). If not set then this will default to the value of columns_md.<\/p><\/li>\n<\/ul>\n\n[mha_image_link] shortcode settings<\/h3>\n\n\nimage<\/strong> *Default: ''**\nSpecify the URL to an image. It's better to use attachment if you can.<\/p><\/li>\ntext<\/strong> *Default: ''**\nThe big text to display on the image<\/p><\/li>\nsubtext<\/strong> *Default: false**\nThe smaller text to show on the image link<\/p><\/li>\nlink<\/strong> *Default: ''**\nThe link this image should direct to. Can be anything href=\"\" takes.<\/p><\/li>\nattachment<\/strong> *Default: false**\nThe attachment ID of the image you want to use or the image. If you specify this instead of image<\/code> then you'll get a properly sized image and everything will be excellent.\nTo get the attachment ID find the attachment in your Dashbaord -> media screen, click the one you want and look in your browsers address bar for the Item number. For example in this address upload.php?item=400<\/code> the attachment ID is 400.<\/p><\/li>\nstyle<\/strong> *Default: half**\nBy default the caption covers half the image - you can set style to full<\/code> to make it cover the whole image. You can also enter anything you like here and the .mha-image-link<\/code> element will be given it as an extra class. See the bottom of image-link.scss<\/code> for an example of styling it.<\/p><\/li>\n<\/ul>\n\n\n\n- Upload the plugin directory
image-links<\/code> to the \/wp-content\/plugins\/<\/code> directory or install it directly from the Wordpress plugin directory.<\/li>\n- Activate the plugin through the 'Plugins' menu in WordPress<\/li>\n
- Add some [mha_image_link] shortcodes to your pages\/site using the settings below.<\/li>\n<\/ol>\n\n\n
\nHow do I change the output styles<\/h3><\/dt>\nYou can customise the look and feel of the image links by writing your own CSS. You can use the included .scss file<\/p>\n\n
You can either include the scss file in your own SCSS and override it, or you can edit a copy of the scss file and compile it, then auto-prefix it, using these online services. Store the output in your child-theme template and include it using wp_enqueue_style inside a wp_enqueue_style hook.<\/p>\n\n
\n- http:\/\/beautifytools.com\/scss-compiler.php<\/li>\n
- https:\/\/autoprefixer.github.io\/<\/li>\n<\/ul><\/dd>\n\n<\/dl>\n\n\n
1.4<\/h4>\n\n
Tested with WordPress 6.0<\/p>\n\n
1.3<\/h4>\n\n
Tested with WordPress 5.1<\/p>\n\n
1.2<\/h4>\n\n
Reduced font-sizes on large screens.<\/p>\n\n
1.1<\/h4>\n\n
Fixed JavaScript - which wasn't running at all. Also made the slidehosw delay be random rather than always 7 seconds.<\/p>\n\n
1<\/h4>\n\n
Initial release<\/p>","raw_excerpt":"Outputs links which are images, with floting-over captions and changing images. Easily lets you disable the styles (and Scripts) so you can write your …","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin\/90894","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin"}],"about":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/types\/plugin"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/comments?post=90894"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wporg\/v1\/users\/patabugen"}],"wp:attachment":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/media?parent=90894"}],"wp:term":[{"taxonomy":"plugin_section","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_section?post=90894"},{"taxonomy":"plugin_tags","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_tags?post=90894"},{"taxonomy":"plugin_category","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_category?post=90894"},{"taxonomy":"plugin_contributors","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_contributors?post=90894"},{"taxonomy":"plugin_business_model","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_business_model?post=90894"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}