{"id":438,"date":"2014-12-08T10:50:01","date_gmt":"2014-12-08T10:50:01","guid":{"rendered":"http:\/\/www.infinitee-designs.com\/webdesign\/how-make-thumbnails-image-page-or-post\/"},"modified":"2022-01-24T00:12:55","modified_gmt":"2022-01-24T00:12:55","slug":"how-make-thumbnails-image-page-or-post","status":"publish","type":"page","link":"https:\/\/www.infinitee-designs.com\/webdesign\/how-make-thumbnails-image-page-or-post\/","title":{"rendered":"How to make thumbnails from an image on a page or, in a post"},"content":{"rendered":"
\n

Drupal CKeditor and FCKeditor tutorial on creating thumbnails directly from an image that you have added to a page or, post. Also, while you are uploading images.<\/p>\n

\"How \"How\"How<\/p>\n

Thumbnails are smaller versions of a larger image that can be used as is or, as a link to any content. Standard sizes for the CKeditor are 90×90, 120×120 and 180×180. You can make thumbnails of an image in various sizes and then use the thumbnails in other posts “Body” or, the “Summery”. The “Summery” is what gets displayed on the front page if your site is set up that way. When making them your original file will be re-sized and re-named with a prefix that describes the size… small_<\/strong>original-file-name.jpg, medium_<\/strong>original-file-name.jpg and large_<\/strong>original-file-name.jpg.<\/p>\n

 <\/p>\n

Once you have added an image to a post via the CKedtors advanced image upload system. “Uploading images from your computer with the File Browser”<\/a> you can make thumbnails directly from within the file Browser editor.<\/p>\n

Note:<\/strong> You can create thumbnails while you are uploading your images… Check mark the thumbnail sizes that you would like to create before you hit “Upload”.<\/p>\n

 <\/p>\n

From an image that you have already added to a page or, post.<\/h2>\n

\"How<\/a><\/p>\n

From an image on a page or, in a post.<\/p>\n

1. Log in to your website and click the “Edit” button on any page or, blog post.<\/p>\n

2. Double click on the image in the post and then hit “Browse Server”.<\/p>\n

3. Find and select the image that you would like to create thumbnails for and then hit the “Thumbnails” button (upper left).<\/p>\n

4. Check mark the thumbnail sizes that you would like to create and hit “Create thumbnails”.<\/p>\n

5. Once the thumbnails have been created, you can double click on one to add it to any post.<\/p>\n

 <\/p>\n

Call me anytime if you have any questions and…
\nHave fun! | Email<\/a><\/strong><\/p>\n

Ralph Manis – Infinitee Drupal Web Design<\/p>\n<\/div>\n","protected":false},"excerpt":{"rendered":"

Drupal CKeditor tutorial on how to make thumbnails directly from an image that you have added to a page or, post. Also, while you are uploading images<\/p>\n","protected":false},"author":1,"featured_media":434,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_eb_attr":"","site-sidebar-layout":"default","site-content-layout":"default","ast-site-content-layout":"default","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ngg_post_thumbnail":0,"footnotes":""},"vocabulary_1":[90,131,74,16],"class_list":["post-438","page","type-page","status-publish","has-post-thumbnail","hentry","vocabulary_1-drupal-tutorials","vocabulary_1-drupal-web-design-tutorials","vocabulary_1-web-design-tutorials","vocabulary_1-web-development"],"yoast_head":"\nHow to make thumbnails from an image on a page or in a blog post<\/title>\n<meta name=\"description\" content=\"How to make thumbnails - Drupal CKeditor tutorial on how to make thumbnails directly from an image that you have added to a page or, post.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.infinitee-designs.com\/webdesign\/how-make-thumbnails-image-page-or-post\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to make thumbnails from an image on a page or in a blog post\" \/>\n<meta property=\"og:description\" content=\"How to make thumbnails - Drupal CKeditor tutorial on how to make thumbnails directly from an image that you have added to a page or, post.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.infinitee-designs.com\/webdesign\/how-make-thumbnails-image-page-or-post\/\" \/>\n<meta property=\"og:site_name\" content=\"INFINITEE WEB DESIGN\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/infinitee.web.designs\" \/>\n<meta property=\"article:modified_time\" content=\"2022-01-24T00:12:55+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/i0.wp.com\/www.infinitee-designs.com\/webdesign\/wp-content\/uploads\/2014\/12\/small_making-thumbnails.jpg?fit=90%2C90&ssl=1\" \/>\n\t<meta property=\"og:image:width\" content=\"90\" \/>\n\t<meta property=\"og:image:height\" content=\"90\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:site\" content=\"@Infinitee_Web\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"3 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.infinitee-designs.com\\\/webdesign\\\/how-make-thumbnails-image-page-or-post\\\/\",\"url\":\"https:\\\/\\\/www.infinitee-designs.com\\\/webdesign\\\/how-make-thumbnails-image-page-or-post\\\/\",\"name\":\"How to make thumbnails from an image on a page or in a blog post\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.infinitee-designs.com\\\/webdesign\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.infinitee-designs.com\\\/webdesign\\\/how-make-thumbnails-image-page-or-post\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.infinitee-designs.com\\\/webdesign\\\/how-make-thumbnails-image-page-or-post\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.infinitee-designs.com\\\/webdesign\\\/wp-content\\\/uploads\\\/2014\\\/12\\\/small_making-thumbnails.jpg\",\"datePublished\":\"2014-12-08T10:50:01+00:00\",\"dateModified\":\"2022-01-24T00:12:55+00:00\",\"description\":\"How to make thumbnails - Drupal CKeditor tutorial on how to make thumbnails directly from an image that you have added to a page or, post.\",\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.infinitee-designs.com\\\/webdesign\\\/how-make-thumbnails-image-page-or-post\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.infinitee-designs.com\\\/webdesign\\\/how-make-thumbnails-image-page-or-post\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.infinitee-designs.com\\\/webdesign\\\/wp-content\\\/uploads\\\/2014\\\/12\\\/small_making-thumbnails.jpg\",\"contentUrl\":\"https:\\\/\\\/www.infinitee-designs.com\\\/webdesign\\\/wp-content\\\/uploads\\\/2014\\\/12\\\/small_making-thumbnails.jpg\",\"width\":90,\"height\":90,\"caption\":\"Small Thumbnail\"},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.infinitee-designs.com\\\/webdesign\\\/#website\",\"url\":\"https:\\\/\\\/www.infinitee-designs.com\\\/webdesign\\\/\",\"name\":\"INFINITEE WEB DESIGN\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.infinitee-designs.com\\\/webdesign\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.infinitee-designs.com\\\/webdesign\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.infinitee-designs.com\\\/webdesign\\\/#organization\",\"name\":\"Infinitee Designs\",\"url\":\"https:\\\/\\\/www.infinitee-designs.com\\\/webdesign\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.infinitee-designs.com\\\/webdesign\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/i0.wp.com\\\/www.infinitee-designs.com\\\/webdesign\\\/wp-content\\\/uploads\\\/2022\\\/01\\\/infinitee-web-design-logo.png?fit=430%2C150&ssl=1\",\"contentUrl\":\"https:\\\/\\\/i0.wp.com\\\/www.infinitee-designs.com\\\/webdesign\\\/wp-content\\\/uploads\\\/2022\\\/01\\\/infinitee-web-design-logo.png?fit=430%2C150&ssl=1\",\"width\":430,\"height\":150,\"caption\":\"Infinitee Designs\"},\"image\":{\"@id\":\"https:\\\/\\\/www.infinitee-designs.com\\\/webdesign\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/infinitee.web.designs\",\"https:\\\/\\\/x.com\\\/Infinitee_Web\",\"https:\\\/\\\/www.instagram.com\\\/infiniteewebdesign\\\/\",\"http:\\\/\\\/www.linkedin.com\\\/in\\\/infinitee\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"How to make thumbnails from an image on a page or in a blog post","description":"How to make thumbnails - Drupal CKeditor tutorial on how to make thumbnails directly from an image that you have added to a page or, post.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.infinitee-designs.com\/webdesign\/how-make-thumbnails-image-page-or-post\/","og_locale":"en_US","og_type":"article","og_title":"How to make thumbnails from an image on a page or in a blog post","og_description":"How to make thumbnails - Drupal CKeditor tutorial on how to make thumbnails directly from an image that you have added to a page or, post.","og_url":"https:\/\/www.infinitee-designs.com\/webdesign\/how-make-thumbnails-image-page-or-post\/","og_site_name":"INFINITEE WEB DESIGN","article_publisher":"https:\/\/www.facebook.com\/infinitee.web.designs","article_modified_time":"2022-01-24T00:12:55+00:00","og_image":[{"width":90,"height":90,"url":"https:\/\/i0.wp.com\/www.infinitee-designs.com\/webdesign\/wp-content\/uploads\/2014\/12\/small_making-thumbnails.jpg?fit=90%2C90&ssl=1","type":"image\/jpeg"}],"twitter_card":"summary_large_image","twitter_site":"@Infinitee_Web","twitter_misc":{"Est. reading time":"3 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.infinitee-designs.com\/webdesign\/how-make-thumbnails-image-page-or-post\/","url":"https:\/\/www.infinitee-designs.com\/webdesign\/how-make-thumbnails-image-page-or-post\/","name":"How to make thumbnails from an image on a page or in a blog post","isPartOf":{"@id":"https:\/\/www.infinitee-designs.com\/webdesign\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.infinitee-designs.com\/webdesign\/how-make-thumbnails-image-page-or-post\/#primaryimage"},"image":{"@id":"https:\/\/www.infinitee-designs.com\/webdesign\/how-make-thumbnails-image-page-or-post\/#primaryimage"},"thumbnailUrl":"https:\/\/www.infinitee-designs.com\/webdesign\/wp-content\/uploads\/2014\/12\/small_making-thumbnails.jpg","datePublished":"2014-12-08T10:50:01+00:00","dateModified":"2022-01-24T00:12:55+00:00","description":"How to make thumbnails - Drupal CKeditor tutorial on how to make thumbnails directly from an image that you have added to a page or, post.","inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.infinitee-designs.com\/webdesign\/how-make-thumbnails-image-page-or-post\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.infinitee-designs.com\/webdesign\/how-make-thumbnails-image-page-or-post\/#primaryimage","url":"https:\/\/www.infinitee-designs.com\/webdesign\/wp-content\/uploads\/2014\/12\/small_making-thumbnails.jpg","contentUrl":"https:\/\/www.infinitee-designs.com\/webdesign\/wp-content\/uploads\/2014\/12\/small_making-thumbnails.jpg","width":90,"height":90,"caption":"Small Thumbnail"},{"@type":"WebSite","@id":"https:\/\/www.infinitee-designs.com\/webdesign\/#website","url":"https:\/\/www.infinitee-designs.com\/webdesign\/","name":"INFINITEE WEB DESIGN","description":"","publisher":{"@id":"https:\/\/www.infinitee-designs.com\/webdesign\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.infinitee-designs.com\/webdesign\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.infinitee-designs.com\/webdesign\/#organization","name":"Infinitee Designs","url":"https:\/\/www.infinitee-designs.com\/webdesign\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.infinitee-designs.com\/webdesign\/#\/schema\/logo\/image\/","url":"https:\/\/i0.wp.com\/www.infinitee-designs.com\/webdesign\/wp-content\/uploads\/2022\/01\/infinitee-web-design-logo.png?fit=430%2C150&ssl=1","contentUrl":"https:\/\/i0.wp.com\/www.infinitee-designs.com\/webdesign\/wp-content\/uploads\/2022\/01\/infinitee-web-design-logo.png?fit=430%2C150&ssl=1","width":430,"height":150,"caption":"Infinitee Designs"},"image":{"@id":"https:\/\/www.infinitee-designs.com\/webdesign\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/infinitee.web.designs","https:\/\/x.com\/Infinitee_Web","https:\/\/www.instagram.com\/infiniteewebdesign\/","http:\/\/www.linkedin.com\/in\/infinitee"]}]}},"_links":{"self":[{"href":"https:\/\/www.infinitee-designs.com\/webdesign\/wp-json\/wp\/v2\/pages\/438","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.infinitee-designs.com\/webdesign\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.infinitee-designs.com\/webdesign\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.infinitee-designs.com\/webdesign\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.infinitee-designs.com\/webdesign\/wp-json\/wp\/v2\/comments?post=438"}],"version-history":[{"count":0,"href":"https:\/\/www.infinitee-designs.com\/webdesign\/wp-json\/wp\/v2\/pages\/438\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.infinitee-designs.com\/webdesign\/wp-json\/wp\/v2\/media\/434"}],"wp:attachment":[{"href":"https:\/\/www.infinitee-designs.com\/webdesign\/wp-json\/wp\/v2\/media?parent=438"}],"wp:term":[{"taxonomy":"vocabulary_1","embeddable":true,"href":"https:\/\/www.infinitee-designs.com\/webdesign\/wp-json\/wp\/v2\/vocabulary_1?post=438"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}