Hostinger WordPress Tutorial 2026: Step-by-Step Guide for Beginners
📺 ดูคลิป · 👁️ 28,344 views · 📅 2025 · ⏱️ 13:31 · 🌐 Websites / WordPress / Hosting / Builders
📌 สรุป
คลิปนี้เป็น tutorial ครบจบสำหรับผู้เริ่มต้น สอนวิธีสร้างเว็บไซต์ WordPress ด้วย Hostinger ตั้งแต่สมัครแพลน เลือกโดเมน ติดตั้ง WordPress ใช้ theme Astra + plugin Starter Templates และแก้ไขเนื้อหาด้วย Elementor page builder แบบ drag-and-drop ทั้งหมดทำได้ฟรียกเว้นค่า hosting
🔑 ประเด็น / ขั้นตอนหลัก
- สมัคร Hostinger: เลือกแพลน Premium (ถูกสุดที่คลิปแนะนำ) → เลือกระยะ 12 หรือ 48 เดือน → ลงทะเบียน → ชำระเงิน → verify อีเมล
- รับโดเมนฟรี: กด claim domain → พิมพ์ชื่อที่ต้องการ (สั้น จำง่าย .com) → ตรวจสอบว่าว่างอยู่ → claim → verify อีเมลโดเมนแยกอีกครั้ง
- ติดตั้ง WordPress: กด continue setup → เลือก build with WordPress → ตั้ง login ของ WP → เลือกโดเมน → เลือก data center ใกล้กลุ่มเป้าหมาย → install
- ล้าง WP Admin dashboard: dismiss welcome banner → เปิด Screen Options → uncheck ทุก element เพื่อให้หน้าสะอาด
- ติดตั้ง Theme Astra: Appearance → Themes → Add Theme → ค้นหา Astra → Install → Activate
- ติดตั้ง Plugin Starter Templates: Plugins → Add New → ค้นหา Starter Templates → Install → Activate → Build with Templates → เลือก Elementor เป็น page builder
- เลือก template: เลือกแบบฟรี (มีแบบ Premium ด้วย) → ปรับ font/color → Submit and build → รอสักครู่แล้ว visit site
- แก้ไขเนื้อหาด้วย Elementor: คลิก Edit with Elementor → แก้ text/image/button ได้โดยตรงบนหน้าจอ → ปรับ style ที่แถบซ้าย → ใช้ Structure panel (Cmd+I) ดูโครงสร้าง container
- เพิ่มหน้าใหม่: WP admin bar → New → Page → ตั้งชื่อ → Publish → Edit with Elementor → drag widget มาวาง หรือ import template จาก Starter Templates
- เพิ่มหน้าเข้า Navigation Menu: Customize → Menus → Main Menu → Add Items → เลือกหน้าที่ต้องการ → Publish
- แก้ header/footer: เข้า Customize → hover pencil icon → แก้ logo/layout ของ header และ footer ได้โดยตรง
🛠️ เครื่องมือ / บริการ / ลิงก์ที่พูดถึง
- Hostinger – hosting แพลน Premium / Business (มีโดเมนฟรี, 12 เดือนหรือ 48 เดือน)
- ลิงก์พิเศษในคำอธิบายวิดีโอ – ส่วนลด 10% เพิ่มเติม (affiliate link ของช่อง)
- WordPress – CMS ฟรี
- Astra – free WordPress theme
- Starter Templates – free plugin สำหรับ import template สำเร็จรูป (มีแบบ Premium ด้วย)
- Elementor – free visual page builder (drag-and-drop)
💡 เอาไปใช้ / ข้อสังเกต
- ช่องนี้ใช้โมเดล affiliate Hostinger อย่างชัดเจน — ทุก tutorial มักจบด้วยลิงก์พิเศษ discount 10% ซึ่งเป็น affiliate link หลักของ Metics Media
- กลยุทธ์คอนเทนต์: สอนฟรีทุกขั้นตอน เฉพาะ hosting เท่านั้นที่ต้องจ่าย ทำให้ผู้ชมไม่รู้สึกถูกขาย แต่มีแรงจูงใจคลิกลิงก์
- Stack ที่คลิปแนะนำ (Hostinger + Astra + Starter Templates + Elementor) เป็น stack มาตรฐานที่ affiliate marketer WordPress ไทย/ต่างประเทศนิยมใช้เพราะต้นทุนต่ำ ขยายได้ง่าย
- สำหรับผู้การที่อยากทดลองทำเว็บ WordPress: แพลน Premium 12 เดือนเพียงพอสำหรับเริ่มต้น ไม่ต้องรีบซื้อ 48 เดือน
- Elementor free version ใช้ได้ดีสำหรับงานพื้นฐาน ไม่จำเป็นต้องซื้อ Pro ในช่วงเริ่มต้น
📄 Transcript เต็ม (English, 2,215 คำ)
Hi, my name is Dan and in this tutorial I'll show you how to easily set up your WordPress website using Hostinger. We'll start by signing up with Hostinger and securing the best available price for your WordPress hosting. Next, I'll guide you through setting up your domain and installing WordPress. Then, I'll show you how to get free access to hundreds of professionally designed website templates that are fully customizable and mobile friendly. You'll also learn how to easily customize these templates using Elementor, the most popular visual page builder for WordPress. Everything we use in this video is free except for the hosting with Hostinger, but if you use the special link in the video description, you'll get an exclusive 10% discount on your hosting plan, a better deal than what you'll find even on Hostinger's homepage. Let's select a hosting plan and domain now. So, to get your additional 10% off and to get a free domain, click claim deal. Here we can see the hosting or plans. While the business plan does offer a few benefits, you can always upgrade later. And everything I show you in this tutorial, you can do with the premium plan. So, I'll click choose plan. On this screen, you can select your hosting period. Choosing 48 months saves you the most money by locking in this rate, but 12 months is still a great deal to get started. You still get a free domain. And I'll click continue. Next, register with Hostinger by creating a username and a password. Once you've registered, enter your billing address followed by your payment information. Then click submit payment. Once you've paid, you'll land on the Hostinger onboarding. To save some time and skip the onboarding sequence for now, let's click on the Hostinger logo here up at the top and go straight to the Hostinger dashboard. Confirm by clicking leave. And now we're on the Hostinger dashboard. In our to-do items, you can see that we need to verify our email. Let's open our email inbox in a new tab. Find the hosting or email with the subject line verify your email address. Open it and then click verify email. That will complete the verification step and bring us back to the dashboard. So, we can now close these other two tabs. Now that we've verified our email, we're officially done setting up hosting. Next, let's choose our free domain. And our domain is simply the name of our website. For your website, it can be anything you like as long as it's still available. Click claim domain here. Ideally, you pick something short, memorable, and a.com domain that's still available. I'll go with hwp tutorial 2, as in hosting or WordPress tutorial. And then click check availability. When you find something available, click claim domain. Here you may be prompted to enter your contact details to register your domain. And after you do that, it's important to verify your email address. Let's just do that now so that we don't forget. Open your email inbox once more. Find the new email with subject line. Verify your email address to use your domain and open that. Then click verify email. Once verified, you can close these two tabs. Now that we have set up our hosting and we have our domain, it's time to install WordPress. Click the continue button here to get started. Next, we want to create a website and if prompted, click continue setup. Your website will be for you or your business. And we want to create a website. Click next. Here we'll choose to build with WordPress. And then on the next screen, you'll create login details for your WordPress account. This is the account that you'll use to manage your website. Click next. Here, I'm going to choose create blank site. Don't stress if this screen appears slightly different for you or if it prompts you to choose a theme in order to continue. I will show you how to change the theme later. So, for now, choose the default theme if you don't see a blank site button. On this screen, we want to select the domain that we just registered. So, I'll pick mine from the drop down. And then you want to select the closest data center to your audience. The default is usually fine here. So, I'll leave mine as is. Once that's selected, I'll click install WordPress. And this will usually only take a few minutes. Great. Now, we've arrived at the WordPress admin dashboard. This is your website's back end, the place you'll come when you want to make a change, publish a page, or install something new. You will land here in the hostinger section. So, let's click dashboard home. Before we start designing, let's clean up these tiles and messages so that your WP admin dashboard is free of clutter. I'll dismiss the welcome banner and then I'll open screen options here. I'm going to uncheck all of the screen elements. You can always add ones back in later if you'd like. Then, I'll collapse my screen options. The next important thing we have to do is install our theme, which will give our website the basic structure. A theme controls the colors, fonts, and layouts. And we'll install a popular free theme called Astra. From our dashboard, hover over appearance and then click themes. Then click add theme. If you don't see it here, you can search in the top right. I'll type in Astra. Then hover over it and click install. Once it's done installing, click activate. Next, I'm going to show you how to get access to hundreds of free website templates that are fully customizable using a plugin. A plugin works like an app for your website. It adds new features just like apps do on your phone. Click on plugins, then go up to plugin. Search plugins for starter templates. When you see this one, you can click install now. Once it's done installing, click activate to open starter templates. Here, click build with templates. If you don't see Elementor as an option, please check out the video linked in the card in the top right, which will show you how to fix this. And then select Elementor as our page builder. Starter Templates lets you build and edit pages using simple drag and drop tools. It gives you many readymade designs to choose from, and we'll use one that's totally free. Now, let's pick a template for your website. A template gives you a complete layout with pages already designed. So, what's the difference between a theme and a template? A theme, like Astra, controls the overall look of your entire website. Things like fonts, colors, and layout. A template only controls the layout of one specific page, like your homepage, or about page. You can still change anything later, but choosing a good template gives us a great starting point. As you scroll, you'll see a few of these that are marked as premium. And if you click on any one of these, you can get a preview. If you aren't sure, click this X to return to the previous page. You can browse by category if you find that helpful. But this one caught my eye earlier, and I'll select that. If you have a site logo already, you can upload that here, but I'll show you how to do that later if you don't have one yet. And then you can choose a font pair and color palette here as well. When you're ready, click continue. Instead of selecting features, I'll click skip this step. And I'll skip and continue here. And finally, check that you understand and click submit and build my website. Your website may take just a few minutes to build. Once it's finished, click here to visit your website. With your template installed and your site built, you can explore and navigate around, but it's time to use the Elementor page builder to change what's on your website. Elementor is a visual page builder. That means that you can click on something like text or an image and just change it right on the screen. You can close this tab and in the WordPress admin bar, click edit with Elementor. I'll walk you through each step using Elementor so that you can feel confident editing your site anytime. Each page is structured into containers. If we hover over these sections, we can see them outlined in Magenta. And we have container handles here as well. This structure panel is helpful to quickly select containers on our page. And if you toggle the visibility of containers, that can help you identify them. I'll hide the structure panel for now by using command I on a Mac keyboard or controlI I on a Windows keyboard. Let me scroll down and to add a new container, hover over an existing container and click on this plus icon. That will show you options to add new content. To move a container, hover over an existing container until it shows the container handle. Then drag it into a new position on the page. To remove any container, simply click on the X. Containers hold the elements that make up the content of the page, like headings, text, buttons, and images. If I reopen my structure panel using command I, we can see the elements nested within the containers here. Let's look at how to edit these elements. To edit that text, just select any text on the page and simply change the text. We can also edit the text over here on the left. When we click style and then click edit typography, we can edit the style of this text element and we have lots of control over different settings. This works the same way for our buttons. Click on this button and you can make changes here on the left. I'll change the text to say view destinations. And of course, you can style your buttons as well. I'll change my button font color here. To change an image, simply click on the image, then select choose image on the left and upload your new image here. I'll select a new file. And when it's done uploading, select again. In the style tab on the left side, you have many options to make changes to the position and alignment of your image. To make changes to other pages on our website, click the page drop down in the top bar and select a different page. Once we're on the new page, we can edit elements in the exact same way. To add an entirely new page to our website, open a new tab and type in your domain. When you're logged into your WordPress account, you'll be able to see the WP admin bar up here at the top. In the WordPress admin bar, click new, then page. Here we can rename our page and then click publish. If we view our page, it's just bare bones for now. To edit this new page, click edit page, then edit with Elementor. Then you can use the drag and drop functionality to build your page by dragging in the widgets found on the left. I can add and then edit a heading. Then I can add another element and I can drag in an image. And then I can upload a new image there just like we've done before. To speed things up dramatically, you could also import a template from the template library. Scroll down and click the starter templates icon and then find a page that you'd like to import. If you want, you can search. I'll type outdoor. Select one you like, then click import template. After that imports, remove any containers that you don't need. And then you can publish the changes and preview your page if you would like. Now, this new page cannot yet be found in our navigation menu. To add it, click customize, select menus, and then main menu. We can click add items, and then we can select our new page to add it to the menu. and we can publish once more. Finally, let's see how we can edit the header and footer. While we're still in this customization section, hover over the pencil icons and click that to edit our header elements. The outer icon will allow us to change the header height. If we click on the inner edit icon, we can change or rearrange the other header elements. To change the logo, for example, click change image and upload a new logo. And your website footer works in the same way. If we scroll all the way to the bottom, we can click that pencil and that will allow us to edit the footer elements just like we did with the header. Now you know how to set up your WordPress site with Hostinger and you can customize your site content using Elementor. If you haven't been following along already, remember that using the link in the description will get you an additional 10% discount on hosting with Hostinger. Thanks for watching.