{"id":3905,"date":"2021-08-26T16:43:24","date_gmt":"2021-08-26T21:43:24","guid":{"rendered":"https:\/\/www.kasdorf.name\/wordpress\/?p=3905"},"modified":"2022-05-07T14:17:42","modified_gmt":"2022-05-07T19:17:42","slug":"ipanorama-window-size-using-general-settings","status":"publish","type":"post","link":"https:\/\/www.kasdorf.name\/wordpress\/2021\/08\/26\/ipanorama-window-size-using-general-settings\/","title":{"rendered":"iPanorama Window Size Using &#8220;General&#8221; Settings."},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">In a prior post I went through changing the size the 360 is displayed using the &#8220;Embed code with ID&#8221; settings. Some people may find it easier to use the &#8220;General&#8221; settings in iPanorama to set the desired size of the displayed image. Just insert the &#8220;Standard shortcode&#8221; and you are done.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Leaving all settings at their defaults, and using the &#8220;Standard Shortcode&#8221; I get the following for my #9 iPanorama tour.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large is-style-default\"><a href=\"https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-Window-Size-Container-4.jpg\"><img loading=\"lazy\" decoding=\"async\" width=\"644\" height=\"107\" src=\"https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-Window-Size-Container-4-644x107.jpg\" alt=\"\" class=\"wp-image-3909\" srcset=\"https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-Window-Size-Container-4-644x107.jpg 644w, https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-Window-Size-Container-4-300x50.jpg 300w, https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-Window-Size-Container-4.jpg 666w\" sizes=\"auto, (max-width: 644px) 100vw, 644px\" \/><\/a><\/figure>\n\n\n\n<figure class=\"wp-block-image size-full is-style-default\"><a href=\"https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-Window-Size-Container-2.jpg\"><img loading=\"lazy\" decoding=\"async\" width=\"540\" height=\"193\" src=\"https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-Window-Size-Container-2.jpg\" alt=\"\" class=\"wp-image-3907\" srcset=\"https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-Window-Size-Container-2.jpg 540w, https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-Window-Size-Container-2-300x107.jpg 300w\" sizes=\"auto, (max-width: 540px) 100vw, 540px\" \/><\/a><\/figure>\n\n\n\n<figure class=\"wp-block-image size-large is-style-default\"><a href=\"https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-Window-Size-Container-3-1.jpg\"><img loading=\"lazy\" decoding=\"async\" width=\"644\" height=\"268\" src=\"https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-Window-Size-Container-3-1-644x268.jpg\" alt=\"\" class=\"wp-image-3912\" srcset=\"https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-Window-Size-Container-3-1-644x268.jpg 644w, https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-Window-Size-Container-3-1-300x125.jpg 300w, https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-Window-Size-Container-3-1.jpg 716w\" sizes=\"auto, (max-width: 644px) 100vw, 644px\" \/><\/a><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">So, it appears that the &#8220;default&#8221; ends ups 543&#215;269&#8230; why, I have no clue.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full is-style-default\"><a href=\"https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-Window-Size-Container-5.jpg\"><img loading=\"lazy\" decoding=\"async\" width=\"412\" height=\"265\" src=\"https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-Window-Size-Container-5.jpg\" alt=\"\" class=\"wp-image-3913\" srcset=\"https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-Window-Size-Container-5.jpg 412w, https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-Window-Size-Container-5-300x193.jpg 300w\" sizes=\"auto, (max-width: 412px) 100vw, 412px\" \/><\/a><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\"><mark style=\"background-color:rgba(0, 0, 0, 0)\" class=\"has-inline-color has-vivid-red-color\"><strong>Note: You MUST add the units, in this case it is pixels, so make sure you put &#8220;px&#8221; after the number!! Or you will get really frustrated trying to figure out why it isn&#8217;t working!<\/strong><\/mark><\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Now, to experiment, in &#8220;General&#8221; settings, &#8220;Container&#8221;, Turn off Container &#8220;Auto width&#8221; and &#8220;Auto height&#8221;, then set them to another value. I used 300px by 100px here.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full is-style-default\"><a href=\"https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-Window-Size-Container-6.jpg\"><img loading=\"lazy\" decoding=\"async\" width=\"307\" height=\"125\" src=\"https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-Window-Size-Container-6.jpg\" alt=\"\" class=\"wp-image-3915\" srcset=\"https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-Window-Size-Container-6.jpg 307w, https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-Window-Size-Container-6-300x122.jpg 300w\" sizes=\"auto, (max-width: 307px) 100vw, 307px\" \/><\/a><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Not so useful at this size! Unless you just wanted people to see the controls!<\/p>\n\n\n\n<figure class=\"wp-block-image size-full is-style-default\"><a href=\"https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-Window-Size-Container-7.jpg\"><img loading=\"lazy\" decoding=\"async\" width=\"552\" height=\"171\" src=\"https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-Window-Size-Container-7.jpg\" alt=\"\" class=\"wp-image-3916\" srcset=\"https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-Window-Size-Container-7.jpg 552w, https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-Window-Size-Container-7-300x93.jpg 300w\" sizes=\"auto, (max-width: 552px) 100vw, 552px\" \/><\/a><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">The actual image comes out at 269&#215;89, maybe to preserve aspect ratios? Allow room for borders? Maybe padding? Again, I don&#8217;t know, but it does change the displayed image size. You can tweak the sizes to get closer to the actual display size you want.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Changing the Container size, but only using the Width setting while leaving the height set to &#8220;Auto&#8221;. <\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><a href=\"https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-window-size-General-Settings-5.jpg\"><img loading=\"lazy\" decoding=\"async\" width=\"257\" height=\"271\" src=\"https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-window-size-General-Settings-5.jpg\" alt=\"\" class=\"wp-image-3954\"\/><\/a><\/figure>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-window-size-General-Settings-7.jpg\"><img loading=\"lazy\" decoding=\"async\" width=\"644\" height=\"315\" src=\"https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-window-size-General-Settings-7-644x315.jpg\" alt=\"\" class=\"wp-image-3955\" srcset=\"https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-window-size-General-Settings-7-644x315.jpg 644w, https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-window-size-General-Settings-7-300x147.jpg 300w, https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-window-size-General-Settings-7.jpg 688w\" sizes=\"auto, (max-width: 644px) 100vw, 644px\" \/><\/a><\/figure>\n\n\n\n<figure class=\"wp-block-image size-full\"><a href=\"https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-window-size-General-Settings-6.jpg\"><img loading=\"lazy\" decoding=\"async\" width=\"385\" height=\"170\" src=\"https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-window-size-General-Settings-6.jpg\" alt=\"\" class=\"wp-image-3956\" srcset=\"https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-window-size-General-Settings-6.jpg 385w, https:\/\/www.kasdorf.name\/wordpress\/wp-content\/uploads\/2021\/08\/iPanorama-window-size-General-Settings-6-300x132.jpg 300w\" sizes=\"auto, (max-width: 385px) 100vw, 385px\" \/><\/a><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Again, we can see it has changed size, to match the width entered into the Container settings. Not sure where the height comes from! <\/p>\n\n\n\n<p class=\"wp-block-paragraph\">This is mostly to show that in fact these settings work, and how to make basic changes to them.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>In a prior post I went through changing the size the 360 is displayed using the &#8220;Embed code with ID&#8221; settings. Some people may find it easier to use the &#8220;General&#8221; settings in iPanorama to set the desired size of the displayed image. Just insert the &#8220;Standard shortcode&#8221; and you are done. Leaving all settings [&hellip;]<\/p>\n","protected":false},"author":12,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[239,9],"tags":[240],"series":[],"class_list":["post-3905","post","type-post","status-publish","format-standard","hentry","category-ipanorama","category-wordpress-playground","tag-ipanorama"],"_links":{"self":[{"href":"https:\/\/www.kasdorf.name\/wordpress\/wp-json\/wp\/v2\/posts\/3905","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.kasdorf.name\/wordpress\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.kasdorf.name\/wordpress\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.kasdorf.name\/wordpress\/wp-json\/wp\/v2\/users\/12"}],"replies":[{"embeddable":true,"href":"https:\/\/www.kasdorf.name\/wordpress\/wp-json\/wp\/v2\/comments?post=3905"}],"version-history":[{"count":0,"href":"https:\/\/www.kasdorf.name\/wordpress\/wp-json\/wp\/v2\/posts\/3905\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.kasdorf.name\/wordpress\/wp-json\/wp\/v2\/media?parent=3905"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.kasdorf.name\/wordpress\/wp-json\/wp\/v2\/categories?post=3905"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.kasdorf.name\/wordpress\/wp-json\/wp\/v2\/tags?post=3905"},{"taxonomy":"series","embeddable":true,"href":"https:\/\/www.kasdorf.name\/wordpress\/wp-json\/wp\/v2\/series?post=3905"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}