{"id":2967,"date":"2024-05-29T16:19:13","date_gmt":"2024-05-29T16:19:13","guid":{"rendered":"https:\/\/wpeagle.com\/?p=2967"},"modified":"2024-05-29T16:24:14","modified_gmt":"2024-05-29T16:24:14","slug":"how-i-made-my-new-website","status":"publish","type":"post","link":"https:\/\/wpeagle.com\/wordpress\/how-i-made-my-new-website\/","title":{"rendered":"How I made my new website"},"content":{"rendered":"<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 title=\"How I Made My new Website (Estepona.Life)\" width=\"500\" height=\"281\" src=\"https:\/\/www.youtube.com\/embed\/E45V_7y8wiA?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-popcorn-info-text-color has-popcorn-info-background-background-color has-text-color has-background is-layout-constrained wp-container-core-group-is-layout-1 wp-block-group-is-layout-constrained\" style=\"border-radius:5px;border-left-color:var(--wp--preset--color--popcorn-info-text);border-left-width:8px;padding-top:var(--wp--preset--spacing--40);padding-right:var(--wp--preset--spacing--40);padding-bottom:var(--wp--preset--spacing--40);padding-left:var(--wp--preset--spacing--40)\">\n<p class=\"popcorn-alert-text-info\">We may earn a commission if you click on the links within this article.\u00a0<a href=\"https:\/\/wpeagle.com\/funding\/\" data-lasso-id=\"379\">Learn more<\/a>.<\/p>\n<\/div>\n\n\n\n<p>My new website is about ready to launch! At last!<\/p>\n\n\n\n<p>A lot of you have been asking how I put it together.<\/p>\n\n\n\n<p>In this video I take you through the site and show you how it&#8217;s all stitched together.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full\"><img decoding=\"async\" width=\"721\" height=\"2560\" src=\"https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/Estepona-Life-Full-smaller-scaled.jpg\" alt=\"\" class=\"wp-image-2971\" title=\"\" srcset=\"https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/Estepona-Life-Full-smaller-scaled.jpg 721w, https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/Estepona-Life-Full-smaller-288x1024.jpg 288w\" sizes=\"(max-width: 721px) 100vw, 721px\" \/><figcaption class=\"wp-element-caption\">The Estepona.Life Homepage<\/figcaption><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">How I made <a href=\"https:\/\/estepona.life\/\" target=\"_blank\" rel=\"noopener\" data-lasso-id=\"21271\">Estepona.Life<\/a><\/h2>\n\n\n\n<h3 class=\"wp-block-heading\">The Theme<\/h3>\n\n\n\n<p>The site is, of course, running my own theme, <a href=\"https:\/\/wpeagle.com\/popcorn\/\" target=\"_blank\" rel=\"noopener\" data-lasso-id=\"21279\" data-lasso-name=\"Popcorn Theme\">Popcorn<\/a>! \ud83c\udf7f<\/p>\n\n\n\n<p>It&#8217;s based on the Travel demo, available to import when you set up the Popcorn Theme.<\/p>\n\n\n\n<p>I&#8217;ve done a <a data-lasso-id=\"21272\" href=\"https:\/\/wpeagle.com\/wordpress\/how-to-make-a-travel-website-with-wordpress\/\" data-type=\"post\" data-id=\"2468\">full tutorial<\/a> on how it all works.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">The Location Pages<\/h3>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full\"><img decoding=\"async\" width=\"673\" height=\"2560\" src=\"https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/EL-Location-Page-scaled.jpg\" alt=\"\" class=\"wp-image-2973\" title=\"\" srcset=\"https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/EL-Location-Page-scaled.jpg 673w, https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/EL-Location-Page-79x300.jpg 79w, https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/EL-Location-Page-269x1024.jpg 269w, https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/EL-Location-Page-768x2921.jpg 768w, https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/EL-Location-Page-404x1536.jpg 404w\" sizes=\"(max-width: 673px) 100vw, 673px\" \/><figcaption class=\"wp-element-caption\">Estepona.Life Location page<\/figcaption><\/figure>\n\n\n\n<p>The locations (bars, cafes, restaurants etc) are custom posts with some custom fields.<\/p>\n\n\n\n<p>I&#8217;m using the <a href=\"https:\/\/www.advancedcustomfields.com\/\" target=\"_blank\" rel=\"noopener\" data-lasso-id=\"21280\">ACF plugin<\/a> to do this.<\/p>\n\n\n\n<p>It gives me a bit of extra flexibility and makes it quicker to populate them, as I need to tick a few boxes, and it then pulls things straight into the template.<\/p>\n\n\n\n<p>For example, the features of a place.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"1000\" height=\"206\" src=\"https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/EL-Top-features.jpg\" alt=\"\" class=\"wp-image-2972\" title=\"\" srcset=\"https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/EL-Top-features.jpg 1000w, https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/EL-Top-features-300x62.jpg 300w, https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/EL-Top-features-768x158.jpg 768w\" sizes=\"(max-width: 1000px) 100vw, 1000px\" \/><\/figure>\n\n\n\n<p>Are shown when I tick the relevant boxes&#8230;<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"537\" src=\"https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/Features-1024x537.jpg\" alt=\"\" class=\"wp-image-2974\" title=\"\" srcset=\"https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/Features-1024x537.jpg 1024w, https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/Features-300x157.jpg 300w, https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/Features-768x403.jpg 768w, https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/Features.jpg 1388w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>The rest of the page is just made up of blocks.<\/p>\n\n\n\n<p>The opening hours are a bunch of shortcodes from the <a href=\"https:\/\/wpeagle.com\/business-hours\/\" rel=\"nofollow sponsored noopener\" target=\"_blank\" data-lasso-id=\"21273\" data-lasso-name=\"Business Hours Indicator - Wombat Plugins\">Business Hours plugin<\/a>.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"836\" src=\"https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/Opening-Hours-and-Maps-1024x836.jpg\" alt=\"\" class=\"wp-image-2975\" title=\"\" srcset=\"https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/Opening-Hours-and-Maps-1024x836.jpg 1024w, https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/Opening-Hours-and-Maps-300x245.jpg 300w, https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/Opening-Hours-and-Maps-768x627.jpg 768w, https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/Opening-Hours-and-Maps-1536x1253.jpg 1536w, https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/Opening-Hours-and-Maps.jpg 1554w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>The map is simply the embed code you can grab from Google Maps.<\/p>\n\n\n\n<p>I have <a href=\"https:\/\/wpeagle.com\/wordpress\/how-to-add-a-google-map-to-wordpress\/\" data-type=\"post\" data-id=\"2569\" data-lasso-id=\"21274\">a video on how to do it<\/a>.<\/p>\n\n\n\n<p>The editor&#8217;s comments and pros and cons are standard Popcorn Theme patterns.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"1000\" height=\"816\" src=\"https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/Editors-comment.jpg\" alt=\"\" class=\"wp-image-2976\" title=\"\" srcset=\"https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/Editors-comment.jpg 1000w, https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/Editors-comment-300x245.jpg 300w, https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/Editors-comment-768x627.jpg 768w\" sizes=\"(max-width: 1000px) 100vw, 1000px\" \/><\/figure>\n\n\n\n<p>The Google Reviews section uses a plugin called <a href=\"https:\/\/wpeagle.com\/reviewsfeed\/\" target=\"_blank\" rel=\"nofollow sponsored noopener\" data-lasso-id=\"21275\" data-lasso-name=\"Reviews Feed WordPress Plugin\">Reviews Feed<\/a>.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"1006\" src=\"https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/Google-reviews-1024x1006.jpg\" alt=\"\" class=\"wp-image-2977\" title=\"\" srcset=\"https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/Google-reviews-1024x1006.jpg 1024w, https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/Google-reviews-300x295.jpg 300w, https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/Google-reviews-768x754.jpg 768w, https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/Google-reviews-1536x1508.jpg 1536w, https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/Google-reviews.jpg 1550w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>It&#8217;s really cool. It uses the Google API to pull in the latest reviews for a specific place on Google Maps. You can then style and lay them out as you choose.<\/p>\n\n\n\n<p>I have <a href=\"https:\/\/wpeagle.com\/wordpress\/how-to-add-google-reviews-to-wordpress\/\" data-type=\"post\" data-id=\"2552\" data-lasso-id=\"21276\">a video on how it all works<\/a> too.<\/p>\n\n\n\n<p>The rest of the page is just a mixture of columns, headers, paragraphs, and image gallery blocks.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">The Shop<\/h3>\n\n\n\n<p>Estepona.Life has a shop, so I can sell Estepona-inspired t-shirts.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"701\" height=\"1024\" src=\"https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/EL-shop-701x1024.jpg\" alt=\"\" class=\"wp-image-2979\" title=\"\" srcset=\"https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/EL-shop-701x1024.jpg 701w, https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/EL-shop-205x300.jpg 205w, https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/EL-shop-768x1122.jpg 768w, https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/EL-shop.jpg 1000w\" sizes=\"(max-width: 701px) 100vw, 701px\" \/><\/figure>\n\n\n\n<p>It&#8217;s powered by Woocommerce.<\/p>\n\n\n\n<p>I designed the t-shirts using <a href=\"https:\/\/wpeagle.com\/kittl\/\" target=\"_blank\" rel=\"nofollow sponsored noopener\" data-lasso-id=\"21281\" data-lasso-name=\"Kittl - Unleash Your Creative Power\">Ki<\/a>ttl, which is much better than Canva for T-shirt designs.<\/p>\n\n\n\n<p>I&#8217;ve then created an account with <a href=\"https:\/\/wpeagle.com\/printify\/\" target=\"_blank\" rel=\"nofollow sponsored noopener\" data-lasso-id=\"21282\" data-lasso-name=\"Printify Drop Shipping &amp; Printing Service for E-commerce\">Printify<\/a> to get the t-shirts made.<\/p>\n\n\n\n<p>It&#8217;s very easy to connect your Printify account to Woocommerce.<\/p>\n\n\n\n<p>I&#8217;ve completed a test order, and the T-shirt has been delivered. I&#8217;m impressed with the quality (pic of me wearing it coming soon!)<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">The rest of the site<\/h3>\n\n\n\n<p>The rest of the posts and pages are nothing fancy. Just standard WordPress\/Popcorn posts and pages with a few blocks here and there.<\/p>\n\n\n\n<p>I am using the <a href=\"https:\/\/wpeagle.com\/spectra\/\" target=\"_blank\" rel=\"nofollow sponsored noopener\" data-lasso-id=\"21278\" data-lasso-name=\"Spectra Website Builder - Free Plugin To Extend WordPress Editor\">Spectra plugin<\/a> to give me a few extra blocks over the usual.<\/p>\n\n\n\n<div class=\"wp-block-group popcorn-box-shadow has-popcorn-secondary-color-background-color has-background is-layout-constrained wp-container-core-group-is-layout-2 wp-block-group-is-layout-constrained\" style=\"border-radius:5px;padding-top:var(--wp--preset--spacing--40);padding-right:var(--wp--preset--spacing--40);padding-bottom:var(--wp--preset--spacing--40);padding-left:var(--wp--preset--spacing--40)\">\n<h2 class=\"wp-block-heading\">What do you think? Let me know \u2b07\ufe0f<\/h2>\n\n\n\n<p>Let me know in the comments what you think of my new project! I read all the comments I get.<\/p>\n<\/div>","protected":false},"excerpt":{"rendered":"<p>Here&#8217;s a walkthrough of how I put together my new website for my new online business venture that&#8217;s about helping people discover my town, Estepona.<\/p>\n","protected":false},"author":2,"featured_media":2968,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"rank_math_lock_modified_date":false,"_uag_custom_page_level_css":"","footnotes":""},"categories":[4],"tags":[],"class_list":["post-2967","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-wordpress"],"spectra_custom_meta":{"_edit_lock":["1717599957:3"],"rank_math_internal_links_processed":["1"],"rank_math_primary_category":["4"],"rank_math_seo_score":["26"],"_thumbnail_id":["2968"],"_edit_last":["2"],"_oembed_352e73cc63aec0f669e43faaefbc4b73":["<iframe title=\"How I Made My new Website (Estepona.Life)\" width=\"500\" height=\"281\" src=\"https:\/\/www.youtube.com\/embed\/E45V_7y8wiA?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>"],"_oembed_time_352e73cc63aec0f669e43faaefbc4b73":["1716999860"],"_uag_page_assets":["a:9:{s:3:\"css\";s:263:\".uag-blocks-common-selector{z-index:var(--z-index-desktop) !important}@media (max-width: 976px){.uag-blocks-common-selector{z-index:var(--z-index-tablet) !important}}@media (max-width: 767px){.uag-blocks-common-selector{z-index:var(--z-index-mobile) !important}}\n\";s:2:\"js\";s:0:\"\";s:18:\"current_block_list\";a:41:{i:0;s:10:\"core\/group\";i:3;s:14:\"core\/site-logo\";i:5;s:15:\"core\/navigation\";i:9;s:12:\"core\/columns\";i:10;s:11:\"core\/column\";i:12;s:15:\"core\/post-title\";i:13;s:17:\"core\/post-excerpt\";i:16;s:10:\"core\/image\";i:18;s:14:\"core\/paragraph\";i:21;s:15:\"core\/post-terms\";i:22;s:14:\"core\/post-date\";i:23;s:24:\"outermost\/social-sharing\";i:24;s:29:\"outermost\/social-sharing-link\";i:26;s:17:\"core\/post-content\";i:28;s:13:\"core\/comments\";i:30;s:19:\"core\/comments-title\";i:32;s:21:\"core\/comment-template\";i:35;s:11:\"core\/avatar\";i:37;s:24:\"core\/comment-author-name\";i:39;s:17:\"core\/comment-date\";i:40;s:22:\"core\/comment-edit-link\";i:41;s:20:\"core\/comment-content\";i:42;s:23:\"core\/comment-reply-link\";i:43;s:23:\"core\/post-comments-form\";i:45;s:24:\"core\/comments-pagination\";i:46;s:33:\"core\/comments-pagination-previous\";i:47;s:32:\"core\/comments-pagination-numbers\";i:48;s:29:\"core\/comments-pagination-next\";i:50;s:12:\"core\/heading\";i:53;s:10:\"core\/query\";i:54;s:18:\"core\/post-template\";i:55;s:24:\"core\/post-featured-image\";i:57;s:18:\"core\/template-part\";i:60;s:9:\"core\/list\";i:61;s:14:\"core\/list-item\";i:62;s:10:\"core\/embed\";i:63;s:11:\"core\/search\";i:64;s:17:\"core\/latest-posts\";i:65;s:20:\"core\/latest-comments\";i:66;s:13:\"core\/archives\";i:67;s:15:\"core\/categories\";}s:8:\"uag_flag\";b:0;s:11:\"uag_version\";s:10:\"1731230888\";s:6:\"gfonts\";a:0:{}s:10:\"gfonts_url\";s:0:\"\";s:12:\"gfonts_files\";a:0:{}s:14:\"uag_faq_layout\";b:0;}"],"_uag_css_file_name":["uag-css-2967.css"]},"uagb_featured_image_src":{"full":["https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/how-i-made-my-new-website.jpg",1200,675,false],"thumbnail":["https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/how-i-made-my-new-website-150x150.jpg",150,150,true],"medium":["https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/how-i-made-my-new-website-300x169.jpg",300,169,true],"medium_large":["https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/how-i-made-my-new-website-768x432.jpg",768,432,true],"large":["https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/how-i-made-my-new-website-1024x576.jpg",1024,576,true],"1536x1536":["https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/how-i-made-my-new-website.jpg",1200,675,false],"2048x2048":["https:\/\/wpeagle.com\/wp-content\/uploads\/2024\/05\/how-i-made-my-new-website.jpg",1200,675,false]},"uagb_author_info":{"display_name":"Alex","author_link":"https:\/\/wpeagle.com\/author\/alex\/"},"uagb_comment_info":0,"uagb_excerpt":"Here's a walkthrough of how I put together my new website for my new online business venture that's about helping people discover my town, Estepona.","_links":{"self":[{"href":"https:\/\/wpeagle.com\/wp-json\/wp\/v2\/posts\/2967","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wpeagle.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wpeagle.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wpeagle.com\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/wpeagle.com\/wp-json\/wp\/v2\/comments?post=2967"}],"version-history":[{"count":4,"href":"https:\/\/wpeagle.com\/wp-json\/wp\/v2\/posts\/2967\/revisions"}],"predecessor-version":[{"id":2982,"href":"https:\/\/wpeagle.com\/wp-json\/wp\/v2\/posts\/2967\/revisions\/2982"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wpeagle.com\/wp-json\/wp\/v2\/media\/2968"}],"wp:attachment":[{"href":"https:\/\/wpeagle.com\/wp-json\/wp\/v2\/media?parent=2967"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wpeagle.com\/wp-json\/wp\/v2\/categories?post=2967"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wpeagle.com\/wp-json\/wp\/v2\/tags?post=2967"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}