{"id":1908,"date":"2024-08-11T08:17:57","date_gmt":"2024-08-11T08:17:57","guid":{"rendered":"https:\/\/loftocean.com\/doc\/cozystay\/?post_type=ptkb&#038;p=1908"},"modified":"2024-08-12T03:06:01","modified_gmt":"2024-08-12T03:06:01","slug":"how-to-display-the-total-cost-details-in-the-room-booking-form","status":"publish","type":"ptkb","link":"https:\/\/loftocean.com\/doc\/cozystay\/ptkb\/how-to-display-the-total-cost-details-in-the-room-booking-form\/","title":{"rendered":"How to display the total cost details in the room booking form"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"1908\" class=\"elementor elementor-1908\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-03acda8 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"03acda8\" data-element_type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-no\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-251cfc0\" data-id=\"251cfc0\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-ff437f3 elementor-widget elementor-widget-pt_title\" data-id=\"ff437f3\" data-element_type=\"widget\" data-widget_type=\"pt_title.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\n        <div class=\"pt-title-wrap text-left\">\t            <div class=\"pt-subtitle-wrap\"><span class=\"pt-subtitle\">New Features added in version 1.5.0<\/span><\/div>        <\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-6b8ce20 elementor-widget elementor-widget-text-editor\" data-id=\"6b8ce20\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<h3>Default style for total cost details<\/h3><p>When booking a room, after selecting the check-in\/out dates, number of guests, extra services, etc., the total price of the order will be automatically calculated based on these options.<\/p><p>There is a small arrow next to &#8220;Total Cost&#8221;, which indicates that more information has been folded up. At this time, <strong>click on the &#8220;Total Cost&#8221; line to expand<\/strong> the originally folded information and see the specific details of the total cost.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-2ca3a50 elementor-widget elementor-widget-video\" data-id=\"2ca3a50\" data-element_type=\"widget\" data-settings=\"{&quot;video_type&quot;:&quot;hosted&quot;,&quot;loop&quot;:&quot;yes&quot;,&quot;controls&quot;:&quot;yes&quot;}\" data-widget_type=\"video.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"e-hosted-video elementor-wrapper elementor-open-inline\">\n\t\t\t\t\t<video class=\"elementor-video\" src=\"http:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/expand-total-cost-details.mp4\" loop=\"\" controls=\"\" preload=\"metadata\" controlsList=\"nodownload\"><\/video>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-52ed816 elementor-widget elementor-widget-text-editor\" data-id=\"52ed816\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>You may think that some customers may miss this arrow and wonder where to find the price details of their order. To avoid this situation, you can set the total cost details to be expanded by default. Please see the steps below.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-dc071fe elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"dc071fe\" data-element_type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-e37a77b elementor-widget elementor-widget-text-editor\" data-id=\"e37a77b\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<h3>Display total cost details by default (click to collapse\/expand)<\/h3><p>Open your WordPress <strong>Customizer<\/strong> and navigate to &#8220;<strong>Rooms<\/strong>&#8221; &gt; &#8220;<strong>Booking Form Items<\/strong>&#8220;, find &#8220;<strong>Total Cost Details<\/strong>&#8221; and select &#8220;<strong>Display by default<\/strong>&#8220;.<\/p><figure id=\"attachment_1911\" aria-describedby=\"caption-attachment-1911\" style=\"width: 2284px\" class=\"wp-caption alignnone\"><a href=\"http:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-1.png\"><img fetchpriority=\"high\" decoding=\"async\" class=\"size-full wp-image-1911\" src=\"http:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-1.png\" alt=\"\" width=\"2284\" height=\"1920\" srcset=\"https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-1.png 2284w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-1-300x252.png 300w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-1-1024x861.png 1024w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-1-768x646.png 768w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-1-1536x1291.png 1536w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-1-2048x1722.png 2048w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-1-1920x1614.png 1920w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-1-1440x1211.png 1440w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-1-1200x1009.png 1200w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-1-780x656.png 780w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-1-600x504.png 600w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-1-550x462.png 550w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-1-370x311.png 370w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-1-255x214.png 255w\" sizes=\"(max-width: 2284px) 100vw, 2284px\" \/><\/a><figcaption id=\"caption-attachment-1911\" class=\"wp-caption-text\">Set room order total cost details to be displayed by default.<\/figcaption><\/figure><p>After saving the changes, the total cost details of the room order will be displayed by default. These details can still be collapsed or expanded by clicking on the &#8220;Total Cost&#8221; line.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-45a322f elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"45a322f\" data-element_type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-a68d210 elementor-widget elementor-widget-text-editor\" data-id=\"a68d210\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<h3>Always display total cost details (can no longer be collapsed)<\/h3><p>Open your WordPress <strong>Customizer<\/strong> and navigate to &#8220;<strong>Rooms<\/strong>&#8221; &gt; &#8220;<strong>Booking Form Items<\/strong>&#8220;, find &#8220;<strong>Total Cost Details<\/strong>&#8221; and select &#8220;<strong>Always display<\/strong>&#8220;.<\/p><figure id=\"attachment_1912\" aria-describedby=\"caption-attachment-1912\" style=\"width: 2284px\" class=\"wp-caption alignnone\"><a href=\"http:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-2.png\"><img decoding=\"async\" class=\"size-full wp-image-1912\" src=\"http:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-2.png\" alt=\"\" width=\"2284\" height=\"1920\" srcset=\"https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-2.png 2284w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-2-300x252.png 300w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-2-1024x861.png 1024w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-2-768x646.png 768w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-2-1536x1291.png 1536w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-2-2048x1722.png 2048w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-2-1920x1614.png 1920w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-2-1440x1211.png 1440w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-2-1200x1009.png 1200w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-2-780x656.png 780w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-2-600x504.png 600w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-2-550x462.png 550w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-2-370x311.png 370w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-2-255x214.png 255w\" sizes=\"(max-width: 2284px) 100vw, 2284px\" \/><\/a><figcaption id=\"caption-attachment-1912\" class=\"wp-caption-text\">Set room order total cost details to always be displayed.<\/figcaption><\/figure><p>After saving the changes, the total cost details of the room order will always be shown. These details can no longer be collapsed. The arrow next to Total Cost will disappear.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-a54fb1b elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"a54fb1b\" data-element_type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-4878548 elementor-widget elementor-widget-text-editor\" data-id=\"4878548\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<h3>Total Base Price Breakdown<\/h3><p><strong>What is &#8220;Total Base Price&#8221;?<\/strong><\/p><p>In the expanded Total Cost Details, the following may be included:<\/p><ul><li>Total Base Price<\/li><li>Extra Services Fees<\/li><li>Discounts<\/li><\/ul><p>The &#8220;Total Base Price&#8221; refers to the total price of the room itself. By default, its details are collapsed. You can see an &#8220;i&#8221; icon next to the &#8220;Total Base Price&#8221;. Click it to expand more information:<\/p><ul><li>Total number of nights<\/li><li>Specific price per night<\/li><li>Total base\/room price<\/li><\/ul>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-b9a7b8d elementor-widget elementor-widget-video\" data-id=\"b9a7b8d\" data-element_type=\"widget\" data-settings=\"{&quot;video_type&quot;:&quot;hosted&quot;,&quot;loop&quot;:&quot;yes&quot;,&quot;controls&quot;:&quot;yes&quot;}\" data-widget_type=\"video.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"e-hosted-video elementor-wrapper elementor-open-inline\">\n\t\t\t\t\t<video class=\"elementor-video\" src=\"http:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-base-price-breakdown.mp4\" loop=\"\" controls=\"\" preload=\"metadata\" controlsList=\"nodownload\"><\/video>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-825e6bb elementor-widget elementor-widget-text-editor\" data-id=\"825e6bb\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p><strong>You can set the details of the &#8220;Total Base Price&#8221; to always be displayed:<\/strong><\/p><p>Open your WordPress <strong>Customizer<\/strong> and navigate to &#8220;<strong>Rooms<\/strong>&#8221; &gt; &#8220;<strong>Booking Form Items<\/strong>&#8220;, find &#8220;<strong>Base (Room) Price Breakdown<\/strong>&#8221; and select &#8220;<strong>Always display<\/strong>&#8220;.<\/p><p><a href=\"http:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-3.jpg\"><img decoding=\"async\" class=\"alignnone size-full wp-image-1913\" src=\"http:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-3.jpg\" alt=\"\" width=\"2284\" height=\"1920\" srcset=\"https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-3.jpg 2284w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-3-300x252.jpg 300w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-3-1024x861.jpg 1024w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-3-768x646.jpg 768w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-3-1536x1291.jpg 1536w\" sizes=\"(max-width: 2284px) 100vw, 2284px\" \/><\/a><\/p><figure id=\"attachment_1930\" aria-describedby=\"caption-attachment-1930\" style=\"width: 2400px\" class=\"wp-caption alignnone\"><a href=\"http:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-4.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-1930\" src=\"http:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-4.jpg\" alt=\"\" width=\"2400\" height=\"1238\" srcset=\"https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-4.jpg 2400w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-4-300x155.jpg 300w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-4-1024x528.jpg 1024w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-4-768x396.jpg 768w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-4-1536x792.jpg 1536w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-4-2048x1056.jpg 2048w, https:\/\/loftocean.com\/doc\/cozystay\/wp-content\/uploads\/sites\/7\/2024\/08\/total-cost-4-1920x990.jpg 1920w\" sizes=\"(max-width: 2400px) 100vw, 2400px\" \/><\/a><figcaption id=\"caption-attachment-1930\" class=\"wp-caption-text\">Total Base Price Breakdown displayed by default<\/figcaption><\/figure>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"menu_order":0,"template":"","ptkb_category":[3,17],"class_list":["post-1908","ptkb","type-ptkb","status-publish","hentry","ptkb_category-how-tos-faqs","ptkb_category-rooms-bookings"],"_links":{"self":[{"href":"https:\/\/loftocean.com\/doc\/cozystay\/wp-json\/wp\/v2\/ptkb\/1908","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/loftocean.com\/doc\/cozystay\/wp-json\/wp\/v2\/ptkb"}],"about":[{"href":"https:\/\/loftocean.com\/doc\/cozystay\/wp-json\/wp\/v2\/types\/ptkb"}],"version-history":[{"count":5,"href":"https:\/\/loftocean.com\/doc\/cozystay\/wp-json\/wp\/v2\/ptkb\/1908\/revisions"}],"predecessor-version":[{"id":1944,"href":"https:\/\/loftocean.com\/doc\/cozystay\/wp-json\/wp\/v2\/ptkb\/1908\/revisions\/1944"}],"wp:attachment":[{"href":"https:\/\/loftocean.com\/doc\/cozystay\/wp-json\/wp\/v2\/media?parent=1908"}],"wp:term":[{"taxonomy":"ptkb_category","embeddable":true,"href":"https:\/\/loftocean.com\/doc\/cozystay\/wp-json\/wp\/v2\/ptkb_category?post=1908"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}