{"id":1440,"date":"2025-02-10T15:05:10","date_gmt":"2025-02-10T15:05:10","guid":{"rendered":"https:\/\/tableberg.com\/?p=1440"},"modified":"2025-04-03T14:01:59","modified_gmt":"2025-04-03T14:01:59","slug":"how-to-add-an-image-to-a-table-in-wordpress","status":"publish","type":"post","link":"https:\/\/tableberg.com\/ja\/how-to-add-an-image-to-a-table-in-wordpress\/","title":{"rendered":"How to Add an Image to a Table in WordPress"},"content":{"rendered":"<p>\u30d3\u30b8\u30e5\u30a2\u30eb\u30b3\u30f3\u30c6\u30f3\u30c4\u306f\u3001\u30e6\u30fc\u30b6\u30fc\u3092\u60f9\u304d\u3064\u3051\u308b\u305f\u3081\u306b\u6975\u3081\u3066\u91cd\u8981\u3067\u3042\u308b\u3053\u3068\u306f\u9593\u9055\u3044\u306a\u3044\u3002\u3042\u306a\u305f\u304c\u30d6\u30ed\u30ac\u30fc\u3067\u3042\u308c\u3001\u30a2\u30d5\u30a3\u30ea\u30a8\u30a4\u30bf\u30fc\u3067\u3042\u308c\u3001e\u30b3\u30de\u30fc\u30b9\u306e\u30aa\u30fc\u30ca\u30fc\u3067\u3042\u308c\u3001\u305d\u3046\u3067\u306a\u3044\u4eba\u3067\u3042\u308c\u3001\u69d8\u3005\u306a\u7406\u7531\u3067\u30b0\u30e9\u30d5\u30a3\u30c3\u30af\u30b3\u30f3\u30c6\u30f3\u30c4\u3092\u8ffd\u52a0\u3059\u308b\u5fc5\u8981\u304c\u3042\u308b\u304b\u3082\u3057\u308c\u306a\u3044\u3002<\/p>\n\n\n\n<p>\u753b\u50cf\u306f\u305d\u306e\u3088\u3046\u306a\u91cd\u8981\u306a\u30b0\u30e9\u30d5\u30a3\u30ab\u30eb\u30b3\u30f3\u30c6\u30f3\u30c4\u306e\u4e00\u3064\u3067\u3059\u3002\u591a\u304f\u306e\u30e6\u30fc\u30b6\u30fc\u306f\u3001WordPress\u306e\u30c6\u30fc\u30d6\u30eb\u306b\u753b\u50cf\u3092\u8ffd\u52a0\u3059\u308b\u65b9\u6cd5\u3092\u307e\u3060\u77e5\u308a\u307e\u305b\u3093\u3002\u3057\u304b\u3057\u3001\u753b\u50cf\u3092\u30c6\u30fc\u30d6\u30eb\u306b\u8ffd\u52a0\u3059\u308b\u3053\u3068\u3067\u3001\u4ee5\u4e0b\u306e\u3088\u3046\u306a\u69d8\u3005\u306a\u30bf\u30a4\u30d7\u306e\u30c6\u30fc\u30d6\u30eb\u3092\u7c21\u5358\u306b\u4f5c\u6210\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002 <a href=\"https:\/\/tableberg.com\/ja\/how-to-create-a-comparison-table-in-wordpress\/\" target=\"_blank\" rel=\"noreferrer noopener\">\u6bd4\u8f03<\/a>, <a href=\"https:\/\/tableberg.com\/ja\/how-to-create-a-product-specification-table-in-wordpress\/\" target=\"_blank\" rel=\"noreferrer noopener\">\u88fd\u54c1\u4ed5\u69d8<\/a>, <a href=\"https:\/\/tableberg.com\/ja\/how-to-create-a-pricing-table-in-wordpress\/\" target=\"_blank\" rel=\"noreferrer noopener\">\u4fa1\u683c\u8868<\/a>\u7b49\u3005\u3002<\/p>\n\n\n\n<p>In this article, we\u2019ll show you two easy methods of how to add an image to a table in WordPress. Let\u2019s get started!<\/p>\n\n\n<ul style=\"padding-left: 1.1em; text-align: left; --ub-list-item-icon-top: 3px;; --ub-list-item-icon-size: 0.9em; --ub-list-item-background-image: url('data:image\/svg+xml;utf8,&lt;svg xmlns=&quot;http:\/\/www.w3.org\/2000\/svg&quot; viewBox=&quot;0 0 448 512&quot;&gt;&lt;path fill=&quot;%23000000&quot; d=&quot;M438.6 278.6c12.5-12.5 12.5-32.8 0-45.3l-160-160c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L338.8 224 32 224c-17.7 0-32 14.3-32 32s14.3 32 32 32l306.7 0L233.4 393.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l160-160z&quot;&gt;&lt;\/path&gt;&lt;\/svg&gt;'); --ub-list-item-fa-li-top: 3px; --ub-list-item-spacing: 0px; \" class=\"wp-block-ub-styled-list ub_styled_list\" id=\"ub_styled_list-c778cfdd-dcae-449c-aecb-8213a0447030\"><div class=\"ub-block-list__layout\" style=\"text-align: left; column-count: 1; --ub-list-mobile-column-count: 1; \">\n<li class=\"ub_styled_list_item\" style=\"--ub-list-item-icon-top: 3px; --ub-list-item-icon-size: 0.9em; --ub-list-item-background-image: url('data:image\/svg+xml;utf8,&lt;svg xmlns=&quot;http:\/\/www.w3.org\/2000\/svg&quot; viewBox=&quot;0 0 448 512&quot;&gt;&lt;path fill=&quot;%23000000&quot; d=&quot;M438.6 278.6c12.5-12.5 12.5-32.8 0-45.3l-160-160c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L338.8 224 32 224c-17.7 0-32 14.3-32 32s14.3 32 32 32l306.7 0L233.4 393.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l160-160z&quot;&gt;&lt;\/path&gt;&lt;\/svg&gt;'); \" id=\"ub-styled-list-item-9afa66e4-add9-4608-a09d-0f0e928ad611\">\n\t\t\t<div class=\"ub_list_item_content\">\n\t\t\t\t<span class=\"ub_list_item_icon\">\n\t\t\t\t\t<svg width=\"0.9em\" height=\"0.9em\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewbox=\"0 0 448 512\"><path fill=\"#000000\" d=\"M438.6 278.6c12.5-12.5 12.5-32.8 0-45.3l-160-160c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L338.8 224 32 224c-17.7 0-32 14.3-32 32s14.3 32 32 32l306.7 0L233.4 393.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l160-160z\"><\/path><\/svg>\n\t\t\t\t<\/span>\n\t\t\t\t<span class=\"ub_list_item_text\"><strong>Method 1:<\/strong> <a href=\"#Using-the-Default-Table-Block\">\u30c7\u30d5\u30a9\u30eb\u30c8\u306e\u30c6\u30fc\u30d6\u30eb\u30d6\u30ed\u30c3\u30af\u3092\u4f7f\u3046<\/a><\/span>\n\t\t\t<\/div>\n\t\t\t\n\t\t<\/li>\n\n<li class=\"ub_styled_list_item\" style=\"--ub-list-item-icon-top: 3px; --ub-list-item-icon-size: 0.9em; --ub-list-item-background-image: url('data:image\/svg+xml;utf8,&lt;svg xmlns=&quot;http:\/\/www.w3.org\/2000\/svg&quot; viewBox=&quot;0 0 448 512&quot;&gt;&lt;path fill=&quot;%23000000&quot; d=&quot;M438.6 278.6c12.5-12.5 12.5-32.8 0-45.3l-160-160c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L338.8 224 32 224c-17.7 0-32 14.3-32 32s14.3 32 32 32l306.7 0L233.4 393.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l160-160z&quot;&gt;&lt;\/path&gt;&lt;\/svg&gt;'); \" id=\"ub-styled-list-item-df660d11-266d-4a92-9091-af2bca1ea7f9\">\n\t\t\t<div class=\"ub_list_item_content\">\n\t\t\t\t<span class=\"ub_list_item_icon\">\n\t\t\t\t\t<svg width=\"0.9em\" height=\"0.9em\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewbox=\"0 0 448 512\"><path fill=\"#000000\" d=\"M438.6 278.6c12.5-12.5 12.5-32.8 0-45.3l-160-160c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L338.8 224 32 224c-17.7 0-32 14.3-32 32s14.3 32 32 32l306.7 0L233.4 393.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0l160-160z\"><\/path><\/svg>\n\t\t\t\t<\/span>\n\t\t\t\t<span class=\"ub_list_item_text\"><strong>\u65b9\u6cd52<\/strong>: <a href=\"#Using-the-Tableberg-Block\" target=\"_blank\" rel=\"noreferrer noopener\">Tableberg\u30d6\u30ed\u30c3\u30af\u306e\u4f7f\u7528<\/a><\/span>\n\t\t\t<\/div>\n\t\t\t\n\t\t<\/li>\n<\/div><\/ul>\n\n\n<div class=\"wp-block-group has-border-color has-global-padding is-layout-constrained wp-container-core-group-is-layout-8db5ca72 wp-block-group-is-layout-constrained\" style=\"border-color:#671feb;border-style:solid;border-width:1px;border-radius:4px;padding-top:var(--wp--preset--spacing--medium);padding-right:var(--wp--preset--spacing--small);padding-bottom:var(--wp--preset--spacing--medium);padding-left:var(--wp--preset--spacing--small)\">\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-28f84493 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-vertically-aligned-center is-layout-flow wp-block-column-is-layout-flow\">\n<div class=\"wp-block-group is-vertical is-layout-flex wp-container-core-group-is-layout-505d3e6d wp-block-group-is-layout-flex\" style=\"padding-top:var(--wp--preset--spacing--small);padding-bottom:var(--wp--preset--spacing--small)\">\n<p style=\"font-size:clamp(18.959px, 1.185rem + ((1vw - 3.2px) * 1.175), 30px);\"><strong>\u7f8e\u3057\u3044\u30c6\u30fc\u30d6\u30eb\u3092\u4f5c\u308b <\/strong><br><strong>\u30d6\u30ed\u30c3\u30af\u30a8\u30c7\u30a3\u30bf\u30fc\u4ed8\u304d<\/strong><\/p>\n\n\n\n<div class=\"wp-block-buttons is-content-justification-center is-layout-flex wp-container-core-buttons-is-layout-f2baa792 wp-block-buttons-is-layout-flex\">\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link has-background wp-element-button\" href=\"https:\/\/wordpress.org\/plugins\/tableberg\/\" style=\"background-color:#671feb\" target=\"_blank\" rel=\"noreferrer noopener\">\u7121\u6599\u4f53\u9a13<\/a><\/div>\n\n\n\n<div class=\"wp-block-button is-style-outline is-style-outline--1\"><a class=\"wp-block-button__link wp-element-button\" href=\"https:\/\/tableberg.com\/ja\/%e4%be%a1%e6%a0%bc%e8%a8%ad%e5%ae%9a\/\" target=\"_blank\" rel=\"noreferrer noopener\">\u30d7\u30ed\u306b\u306a\u308b<\/a><\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"540\" height=\"540\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Tableberg.png\" alt=\"\" class=\"wp-image-1545\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Tableberg.png 540w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Tableberg-300x300.png 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Tableberg-150x150.png 150w\" sizes=\"auto, (max-width: 540px) 100vw, 540px\" \/><\/figure>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"Using-the-Default-Table-Block\">\u65b9\u6cd51\uff1a\u30c7\u30d5\u30a9\u30eb\u30c8\u306e\u30c6\u30fc\u30d6\u30eb\u30d6\u30ed\u30c3\u30af\u3092\u4f7f\u3046<\/h2>\n\n\n\n<p>The default <a href=\"https:\/\/tableberg.com\/ja\/%e3%83%96%e3%83%ad%e3%83%83%e3%82%af%e3%82%a8%e3%83%87%e3%82%a3%e3%82%bf%e3%81%ae%e4%bd%bf%e3%81%84%e6%96%b9\/\" target=\"_blank\" rel=\"noreferrer noopener\">Gutenberg\u30d6\u30ed\u30c3\u30af\u30a8\u30c7\u30a3\u30bf<\/a> \u306b\u306f\u3001\u30c4\u30fc\u30eb\u30d0\u30fc\u306b\u3042\u308b\u30a4\u30f3\u30e9\u30a4\u30f3\u753b\u50cf\u30aa\u30d7\u30b7\u30e7\u30f3\u304c\u4ed8\u5c5e\u3057\u3066\u3044\u307e\u3059\u3002\u30c4\u30fc\u30eb\u30d0\u30fc\u306e <a href=\"https:\/\/tableberg.com\/ja\/%e3%83%af%e3%83%bc%e3%83%89%e3%83%97%e3%83%ac%e3%82%b9%e3%81%a7%e3%82%a4%e3%83%b3%e3%83%a9%e3%82%a4%e3%83%b3%e7%94%bb%e5%83%8f%e3%82%92%e8%bf%bd%e5%8a%a0%e3%81%99%e3%82%8b%e6%96%b9%e6%b3%95\/\" target=\"_blank\" rel=\"noreferrer noopener\">Inline Image option<\/a>\u3092\u4f7f\u3048\u3070\u3001WordPress\u306e\u30c6\u30fc\u30d6\u30eb\u306b\u7c21\u5358\u306b\u753b\u50cf\u3092\u8ffd\u52a0\u3059\u308b\u3053\u3068\u304c\u3067\u304d\u307e\u3059\u3002 <\/p>\n\n\n\n<p>\u624b\u9806\u306f\u3053\u3046\u3060\u3002<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u30b9\u30c6\u30c3\u30d71\uff1a\u30a8\u30c7\u30a3\u30bf\u30fc\u306b\u30c6\u30fc\u30d6\u30eb\u30fb\u30d6\u30ed\u30c3\u30af\u3092\u8ffd\u52a0\u3059\u308b<\/h3>\n\n\n\n<p>Open a post or page where you want to add the table. Add the <strong>Table block<\/strong> to the editor.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"655\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Add-the-Table-Block-to-the-Editor.webp\" alt=\"Add the Table Block to the Editor\" class=\"wp-image-1441\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Add-the-Table-Block-to-the-Editor.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Add-the-Table-Block-to-the-Editor-300x154.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Add-the-Table-Block-to-the-Editor-1024x524.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Add-the-Table-Block-to-the-Editor-768x393.webp 768w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>Define the number of rows and columns.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/01\/Set-22-rows-and-columns.webp\" alt=\"Define the number of rows and columns\" class=\"wp-image-482\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/01\/Set-22-rows-and-columns.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/01\/Set-22-rows-and-columns-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/01\/Set-22-rows-and-columns-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/01\/Set-22-rows-and-columns-768x392.webp 768w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>The table will be created in a few seconds.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"655\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Default-table-is-created.webp\" alt=\"Default table is created\" class=\"wp-image-1442\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Default-table-is-created.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Default-table-is-created-300x154.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Default-table-is-created-1024x524.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Default-table-is-created-768x393.webp 768w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">\u30b9\u30c6\u30c3\u30d7 2: \u30a4\u30f3\u30e9\u30a4\u30f3\u753b\u50cf\u30aa\u30d7\u30b7\u30e7\u30f3\u3092\u30c6\u30fc\u30d6\u30eb\u306b\u4f7f\u7528\u3059\u308b<\/h3>\n\n\n\n<p>Place your cursor on the cell where you want to add an image. The toolbar will show up.<\/p>\n\n\n\n<p>\u3092\u30af\u30ea\u30c3\u30af\u3059\u308b\u3002 <strong>More option<\/strong> on the toolbar. Find and hit <strong>Inline Image<\/strong> on the list.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-large has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"523\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Add-the-Inline-Image-Option-to-the-Table-1024x523.webp\" alt=\"\" class=\"wp-image-1443\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Add-the-Inline-Image-Option-to-the-Table-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Add-the-Inline-Image-Option-to-the-Table-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Add-the-Inline-Image-Option-to-the-Table-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Add-the-Inline-Image-Option-to-the-Table.webp 1279w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">\u30b9\u30c6\u30c3\u30d73\uff1a\u753b\u50cf\u306e\u9078\u629e\u3068\u8ffd\u52a0<\/h3>\n\n\n\n<p>You\u2019ll be allowed to add an image whether from the Media Library or by uploading from your local drive. Choose the image you want. Click the <strong>Select button<\/strong> at the end.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"653\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/04\/Image-selected-from-the-media-library.webp\" alt=\"Select and Add an Image\" class=\"wp-image-1180\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/04\/Image-selected-from-the-media-library.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/04\/Image-selected-from-the-media-library-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/04\/Image-selected-from-the-media-library-1024x522.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/04\/Image-selected-from-the-media-library-768x392.webp 768w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>The image will be added in a second. Now, you can increase its size by changing its width.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"655\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Set-width-for-the-Inline-Image.png\" alt=\"Set width for the Inline Image\" class=\"wp-image-1444\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Set-width-for-the-Inline-Image.png 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Set-width-for-the-Inline-Image-300x154.png 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Set-width-for-the-Inline-Image-1024x524.png 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Set-width-for-the-Inline-Image-768x393.png 768w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>Similarly, add a new image to the other column using the same Inline Image option.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"655\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Add-inline-image-to-a-table.webp\" alt=\"Add inline image to a table\" class=\"wp-image-1445\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Add-inline-image-to-a-table.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Add-inline-image-to-a-table-300x154.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Add-inline-image-to-a-table-1024x524.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Add-inline-image-to-a-table-768x393.webp 768w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<div class=\"wp-block-group has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\"><div class=\"wp-block-ub-divider ub_divider ub-divider-orientation-horizontal\" id=\"ub_divider_7a241c92-fa6f-4649-9f97-ddbc8696c721\"><div class=\"ub_divider_wrapper\" style=\"position: relative; margin-bottom: 2px; width: 100%; height: 2px; \" data-divider-alignment=\"center\"><div class=\"ub_divider_line\" style=\"border-top: 2px solid #ccc; margin-top: 2px; \"><\/div><\/div><\/div><\/div>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"Using-the-Tableberg-Block\">\u65b9\u6cd52\uff1aTableberg\u30d6\u30ed\u30c3\u30af\u3092\u4f7f\u3046<\/h2>\n\n\n\n<p><a title=\"\u30c6\u30fc\u30d6\u30eb\u30d0\u30fc\u30b0\" href=\"https:\/\/wordpress.org\/plugins\/tableberg\/\" target=\"_blank\" rel=\"noopener nofollow\">\u30c6\u30fc\u30d6\u30eb\u30d0\u30fc\u30b0<\/a> is a feature-rich and beginner-friendly table builder plugin. With this plugin, you can also build tables and add images to their cells. We have explained the process below.<\/p>\n\n\n\n<p class=\"has-text-align-center has-background\" style=\"background-color:#ffeec9\"><strong>\u6ce8<\/strong>:\u6b21\u306e\u3053\u3068\u3092\u78ba\u8a8d\u3057\u3066\u304f\u3060\u3055\u3044\u3002 <a href=\"https:\/\/tableberg.com\/ja\/%e8%ab%b8%e6%b3%a8%e6%84%8f\/tableberg%e3%83%97%e3%83%a9%e3%82%b0%e3%82%a4%e3%83%b3%e3%81%ae%e3%82%a4%e3%83%b3%e3%82%b9%e3%83%88%e3%83%bc%e3%83%ab%e6%96%b9%e6%b3%95\/\" target=\"_blank\" rel=\"noreferrer noopener\">Tableberg\u30d7\u30e9\u30b0\u30a4\u30f3\u3092\u30a4\u30f3\u30b9\u30c8\u30fc\u30eb\u3057\u3001\u6709\u52b9\u5316\u3059\u308b\u3002<\/a>. <\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u30b9\u30c6\u30c3\u30d701: \u30a8\u30c7\u30a3\u30bf\u30fc\u306bTableberg\u30d6\u30ed\u30c3\u30af\u3092\u8ffd\u52a0\u3059\u308b<\/h3>\n\n\n\n<p>Find and add the <strong>\u30c6\u30fc\u30d6\u30eb\u30d0\u30fc\u30b0\u30fb\u30d6\u30ed\u30c3\u30af<\/strong> to the editor. The block works the same way as the default Table block as shown above.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-large has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"523\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/01\/Find-and-add-the-TableBerg-block-to-your-Gutenberg-editor-1024x523.webp\" alt=\"TableBerg\u30d6\u30ed\u30c3\u30af\u3092\u898b\u3064\u3051\u3066\u3001Gutenberg\u30a8\u30c7\u30a3\u30bf\u306b\u8ffd\u52a0\u3057\u307e\u3059\u3002\" class=\"wp-image-481\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/01\/Find-and-add-the-TableBerg-block-to-your-Gutenberg-editor-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/01\/Find-and-add-the-TableBerg-block-to-your-Gutenberg-editor-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/01\/Find-and-add-the-TableBerg-block-to-your-Gutenberg-editor-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/01\/Find-and-add-the-TableBerg-block-to-your-Gutenberg-editor.webp 1280w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>Define the row and column number.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-large has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"522\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/03\/Select-a-row-and-columns-for-the-table-1024x522.webp\" alt=\"\" class=\"wp-image-1031\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/03\/Select-a-row-and-columns-for-the-table-1024x522.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/03\/Select-a-row-and-columns-for-the-table-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/03\/Select-a-row-and-columns-for-the-table-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/03\/Select-a-row-and-columns-for-the-table.webp 1280w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>The table outline is ready.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"655\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Default-table-is-created.webp\" alt=\"The table outline is ready\" class=\"wp-image-1442\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Default-table-is-created.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Default-table-is-created-300x154.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Default-table-is-created-1024x524.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Default-table-is-created-768x393.webp 768w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">\u30b9\u30c6\u30c3\u30d72\uff1a\u753b\u50cf\u30d6\u30ed\u30c3\u30af\u3092\u30c6\u30fc\u30d6\u30eb\u306b\u8ffd\u52a0\u3059\u308b<\/h3>\n\n\n\n<p>Tableberg\u306b\u306f <strong><a href=\"https:\/\/tableberg.com\/ja\/%e8%ab%b8%e6%b3%a8%e6%84%8f\/how-to-add-images-to-a-table-in-wordpress\/\" target=\"_blank\" rel=\"noreferrer noopener\">\u30a4\u30e1\u30fc\u30b8\u30d6\u30ed\u30c3\u30af<\/a><\/strong>.\u3068\u540c\u69d8\u306e\u50cd\u304d\u3092\u3059\u308b\u3002 <a href=\"https:\/\/tableberg.com\/ja\/%e3%83%af%e3%83%bc%e3%83%89%e3%83%97%e3%83%ac%e3%82%b9%e3%81%ae%e7%94%bb%e5%83%8f%e3%83%96%e3%83%ad%e3%83%83%e3%82%af%e3%81%ae%e4%bd%bf%e3%81%84%e6%96%b9\/\" target=\"_blank\" data-type=\"link\" data-id=\"https:\/\/tableberg.com\/how-to-use-the-image-block-in-wordpress\/\" rel=\"noreferrer noopener\">\u30b0\u30fc\u30c6\u30f3\u30d9\u30eb\u30b0\u753b\u50cf\u30d6\u30ed\u30c3\u30af<\/a>.\u753b\u50cf\u30d6\u30ed\u30c3\u30af\u3092\u30bb\u30eb\u306b\u8ffd\u52a0\u3057\u307e\u3059\u3002<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"655\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Add-the-Image-Block-to-the-Table.webp\" alt=\"Add the Image Block to the Table\" class=\"wp-image-1446\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Add-the-Image-Block-to-the-Table.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Add-the-Image-Block-to-the-Table-300x154.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Add-the-Image-Block-to-the-Table-1024x524.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Add-the-Image-Block-to-the-Table-768x393.webp 768w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>Select the option to upload your desired image from the respective source. For this tutorial, we\u2019ll upload the image from the Media Library.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"655\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Select-the-image-uploading-option.webp\" alt=\"Select the image uploading option\" class=\"wp-image-1447\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Select-the-image-uploading-option.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Select-the-image-uploading-option-300x154.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Select-the-image-uploading-option-1024x524.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Select-the-image-uploading-option-768x393.webp 768w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">\u30b9\u30c6\u30c3\u30d73\uff1a\u753b\u50cf\u306e\u9078\u629e\u3068\u30a2\u30c3\u30d7\u30ed\u30fc\u30c9<\/h3>\n\n\n\n<p>Hope you know what you have to do here. Choose an image and click the <strong>Select button<\/strong>.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"653\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/04\/Image-selected-from-the-media-library.webp\" alt=\"Select and Upload an Image\" class=\"wp-image-1180\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/04\/Image-selected-from-the-media-library.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/04\/Image-selected-from-the-media-library-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/04\/Image-selected-from-the-media-library-1024x522.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/04\/Image-selected-from-the-media-library-768x392.webp 768w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>The image will be added to the table instantly. You can change the size of the image by dragging the edge line as shown in the image below.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"653\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/The-image-will-be-added-to-the-table.webp\" alt=\"The image will be added to the table\" class=\"wp-image-1448\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/The-image-will-be-added-to-the-table.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/The-image-will-be-added-to-the-table-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/The-image-will-be-added-to-the-table-1024x522.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/The-image-will-be-added-to-the-table-768x392.webp 768w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">\u30b9\u30c6\u30c3\u30d74\uff1a\u753b\u50cf\u306e\u30ab\u30b9\u30bf\u30de\u30a4\u30ba\u3068\u30b9\u30bf\u30a4\u30e9\u30a4\u30ba<\/h3>\n\n\n\n<p>\u306b\u6765\u3066\u307b\u3057\u3044\u3002 <strong>\u8a2d\u5b9a\u30bf\u30d6<\/strong> on the right sidebar. You can add an alternative text, aspect ratio, width, height, and resolution, which aren\u2019t possible with the Inline Image option.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-large has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"524\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Configure-the-settings-fo-the-image-block-1024x524.webp\" alt=\"\" class=\"wp-image-1449\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Configure-the-settings-fo-the-image-block-1024x524.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Configure-the-settings-fo-the-image-block-300x154.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Configure-the-settings-fo-the-image-block-768x393.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Configure-the-settings-fo-the-image-block.webp 1280w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>\u306b\u884c\u304f\u3002 <strong>\u30b9\u30bf\u30a4\u30eb\u30bf\u30d6<\/strong>. You can add a border and the border-radius using options from this tab.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"655\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Stylize-the-image-on-the-table.webp\" alt=\"Stylize the image on the table\" class=\"wp-image-1450\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Stylize-the-image-on-the-table.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Stylize-the-image-on-the-table-300x154.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Stylize-the-image-on-the-table-1024x524.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/05\/Stylize-the-image-on-the-table-768x393.webp 768w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>Thus, you can add images to the table in WordPress.<\/p>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe loading=\"lazy\" title=\"WordPress\u3067\u30c6\u30fc\u30d6\u30eb\u30d6\u30ed\u30c3\u30af\u306b\u753b\u50cf\u3092\u8ffd\u52a0\u3059\u308b\u65b9\u6cd5\uff5c\u7121\u6599\u30d7\u30e9\u30b0\u30a4\u30f3Tableberg\" width=\"500\" height=\"281\" src=\"https:\/\/www.youtube.com\/embed\/acGs-w0nk2U?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe>\n<\/div><\/figure>\n\n\n\n<div class=\"wp-block-group has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\"><div class=\"wp-block-ub-divider ub_divider ub-divider-orientation-horizontal\" id=\"ub_divider_a58e77cf-4f6e-4bda-9655-f1e1f2075aea\"><div class=\"ub_divider_wrapper\" style=\"position: relative; margin-bottom: 2px; width: 100%; height: 2px; \" data-divider-alignment=\"center\"><div class=\"ub_divider_line\" style=\"border-top: 2px solid #ccc; margin-top: 2px; \"><\/div><\/div><\/div><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">\u30d5\u30a3\u30cb\u30c3\u30b7\u30f3\u30b0\u30fb\u30ce\u30fc\u30c8<\/h3>\n\n\n\n<p>Although TableBerg is a new plugin, it\u2019s going to be a game changer. It\u2019s going to take the Gutenberg-based table-building experience to the next level very soon. <\/p>\n\n\n\n<p>With the TableBerg plugin, you can add not only images but also various other types of content like ribbons, ratings, bullet lists, CTA buttons, custom HTML, etc.<\/p>\n\n\n\n<p>Using them you can create multifunctional tables with the plugin. Check some posts:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/tableberg.com\/ja\/%e3%83%af%e3%83%bc%e3%83%89%e3%83%97%e3%83%ac%e3%82%b9%e3%81%ae%e7%94%bb%e5%83%8f%e3%82%92%e3%82%ab%e3%83%a9%e3%83%a0%e8%a1%8c%e3%81%ab%e8%a1%a8%e7%a4%ba%e3%81%99%e3%82%8b%e6%96%b9%e6%b3%95\/\" target=\"_blank\" rel=\"noreferrer noopener\">WordPress\u306e\u753b\u50cf\u3092\u5217\u3068\u884c\u3067\u8868\u793a\u3059\u308b\u65b9\u6cd5<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/tableberg.com\/ja\/how-to-try-tableberg\/\" target=\"_blank\" rel=\"noopener\" title=\"How to try TableBerg without installing it on your site\">How to try TableBerg without installing it on your site<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/tableberg.com\/ja\/%e3%83%af%e3%83%bc%e3%83%89%e3%83%97%e3%83%ac%e3%82%b9%e3%81%a7amazon%e3%81%ae%e5%95%86%e5%93%81%e6%af%94%e8%bc%83%e8%a1%a8%e3%82%92%e4%bd%9c%e6%88%90%e3%81%99%e3%82%8b%e6%96%b9%e6%b3%95\/\" target=\"_blank\" rel=\"noopener\" title=\"How to create a product comparison table \">How to create a product comparison table <\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/tableberg.com\/ja\/how-to-create-a-product-specification-table-in-wordpress\/\" target=\"_blank\" rel=\"noopener\" title=\"How to create a product specification table\">How to create a product specification table<\/a><\/li>\n<\/ul>\n\n\n\n<div class=\"wp-block-group has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\"><div class=\"wp-block-ub-divider ub_divider ub-divider-orientation-horizontal\" id=\"ub_divider_37c05b7d-201a-4949-a9a4-a539d3ba76bd\"><div class=\"ub_divider_wrapper\" style=\"position: relative; margin-bottom: 2px; width: 100%; height: 2px; \" data-divider-alignment=\"center\"><div class=\"ub_divider_line\" style=\"border-top: 2px solid #ccc; margin-top: 2px; \"><\/div><\/div><\/div><\/div>","protected":false},"excerpt":{"rendered":"<p>Visual content is undoubtedly crucial for engaging users. Whether you are a blogger, affiliate, eCommerce owner or else, you may need to add graphical content for various reasons. Images are one such important graphical content. Many users yet don&#8217;t know how to add images to WordPress tables. But by adding images to the table, you can easily create various types of tables like comparison, product specification, pricing tables, etc. In this article, we&#8217;ll show you two easy methods of how to add an image to a table in WordPress. Let&#8217;s get started! Method 1: Using the Default Table Block The default Gutenberg block editor comes with the Inline Image option [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":6786,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_eb_attr":"","footnotes":""},"categories":[7],"tags":[83,41,9],"class_list":["post-1440","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-how-to","tag-how-to-add-images","tag-image-block","tag-tableberg"],"featured_image_src":"https:\/\/tableberg.com\/wp-content\/uploads\/2025\/01\/How-to-Create-an-Amazon-Product-Comparison-Table-in-WordPress.png","author_info":{"display_name":"Istiak Rayhan","author_link":"https:\/\/tableberg.com\/ja\/author\/wpx_irayhan\/"},"_links":{"self":[{"href":"https:\/\/tableberg.com\/ja\/wp-json\/wp\/v2\/posts\/1440","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tableberg.com\/ja\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/tableberg.com\/ja\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/tableberg.com\/ja\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/tableberg.com\/ja\/wp-json\/wp\/v2\/comments?post=1440"}],"version-history":[{"count":6,"href":"https:\/\/tableberg.com\/ja\/wp-json\/wp\/v2\/posts\/1440\/revisions"}],"predecessor-version":[{"id":8221,"href":"https:\/\/tableberg.com\/ja\/wp-json\/wp\/v2\/posts\/1440\/revisions\/8221"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/tableberg.com\/ja\/wp-json\/wp\/v2\/media\/6786"}],"wp:attachment":[{"href":"https:\/\/tableberg.com\/ja\/wp-json\/wp\/v2\/media?parent=1440"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/tableberg.com\/ja\/wp-json\/wp\/v2\/categories?post=1440"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/tableberg.com\/ja\/wp-json\/wp\/v2\/tags?post=1440"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}