Thiết kế website chỉ bằng vài click chuột

THIẾT KẾ WEBSITE CHỈ BẰNG VÀI CLICK CHUỘT Copyright by BILLQUY.com Page 0 THIẾT KẾ WEBSITE CHỈ BẰNG VÀI CLICK CHUỘT Copyright by BILLQUY.com Page 1 MỤC LỤC Lời nói đầu Giới Thiệu Phần 1: BẮT ĐẦU LÀM QUEN VỚI BLOGGER Chƣơng 1: Ưu và Nhược điểm của blogger Chƣơng 2: Tham khảo một số sản phẩm làm từ Blogger Chƣơng 3: Hướng dẫn đăng nhập blogger và thiết kế website cơ bản Phần 2: HƢỚNG DẪN ĐĂNG BÀI CƠ BẢN VÀ NÂNG CAO Chƣơng 1: Hướng dẫn đăng bài lên website bằng cách COPY và PASTE Chƣơng 2: Hướng dẫn đăng bài nâng cao bằng cách Copywriting Phần 3: THAY ĐỔI GIAO DIỆN, TẠO THANH MENU, THAY ĐỔI HÌNH GIAO DIỆN Chƣơng 1: Thay đổi giao diện cho website Chƣơng 2: Tạo thanh MENU theo ý của bạn Chƣơng 3: Thay đổi hình giao diện trong Slide ảnh Phần 4: HƢỚNG DẪN ĐIỀU CHỈNH BỐ CỤC VÀ TIỆN ÍCH CHO WEBSITE Chƣơng 1: Hướng dẫn sử dụng tiện ích HTML thêm Video vào website Chƣơng 2: Hướng dẫn sử dụng tiện ích Hình Ảnh tạo Banner Quảng cáo Chƣơng 3: Hướng dẫn sử dụng tiện ích Văn Bản tạo Thông Tin Liên Hệ Chƣơng 4: Giới thiệu sơ lược về một số tiện ích khác Hƣớng dẫn chọn và mua tên miền Một số lời khuyên dành cho các bạn mới lập website bán hàng (Minishop) bằng blogger 1 2 5 6 7 8 11 12 16 19 20 22 29 32 33 36 38 40 41 42 THIẾT KẾ WEBSITE CHỈ BẰNG VÀI CLICK CHUỘT Copyright by BILLQUY.com Page 2 LỜI NÓI ĐẦU Chúng ta đang sống trong một cuộc cách mạng mang tên Internet Marketing! Đó là cuộc cách mạng về cách thức liên hệ giữa mọi người với nhau. Làm thế nào mà một thượng nghị sĩ nhiệm kỳ đầu tiên, một người da màu, trẻ tuổi, không mấy tiếng tăm với đôi tai trông thật khôi hài và một cái tên thậm chí còn khôi hài hơn, lại được bầu làm Tổng Thống của Hợp chủng quốc Hoa Kỳ? Và cuộc cách mạng sẽ chắp cánh cho tự do! Vậy bạn còn chờ đợi điều gì nữa? Tôi là một sinh viên dầu khí, mới bắt đầu bước trên con đường Internet Marketing gần được 4 tháng cách đây (12/2012 – 4/2013). Đầu năm 2012 tôi không biết gì về Internet Marketing, tôi đã được học một lớp về thiết kế website bằng Blogger và từ đó tôi đã lập được website www.aodongphucdn.com. Tôi kinh doanh đầu tiên chỉ yếu là Offline tìm kiếm đơn hàng từ bạn bè, CTV, phát tờ rơi… Tôi gặp khách hàng trực tiếp và giới thiệu về công ty của mình, show website để họ thấy mẫu. Tôi hoàn toàn không ý thức về việc lên top của google. Đối với tôi website chỉ để cho khách hàng lên xem mẫu. Và cuối năm 2012 tôi cất công từ Đà Nẵng vào HCM để học khóa học của anh Richdadloc (INTERNET BOOTCAP 2012 và SOCIAL MEDIA 101). Tôi đã biết thế nào là Internet Marketing, và tôi chuyển hầu như 80% công việc của mình tại ONLINE, và hiện giờ khách hàng của tôi đến từ online. Tôi cùng hai bạn ở Đà Nẵng chạy một hệ thống website: 1. www.amalink.vn 2. www.aodongphucdn.com 3. www.aolopdanang.com 4. www.aodongphucdanang.com 5. www.aodoidanang.com Và một số trang Landing page khác Doanh thu của công ty tăng lên đáng kể, hiện giờ tôi chuyển giao toàn bộ hệ thống này cho hai bạn ở Đà Nẵng làm tôi tập trung 100% thời gian của mình để cùng Onnet phát triển hiện tại và trong tương lai. Hi vọng những kiến thức của tôi làm được và chia sẻ trong cuốn Ebook này sẽ giúp các bạn học và làm được một điều gì đó cho riêng bạn. Chúc các bạn SỨC KHỎE – HẠNH PHÚC – BÌNH AN. THIẾT KẾ WEBSITE CHỈ BẰNG VÀI CLICK CHUỘT Copyright by BILLQUY.com Page 3 GIỚI THIỆU 1. Blogspot là gì? Blogspot (còn gọi là Blogger) giúp bạn tạo ra website hoàn chỉnh cho chính mình chỉ trong vài giây. Tất cả được máy tính thực hiện tự động từ A đến Z, bạn không cần phải lập trình, thiết kế hay phải bỏ ra chút công sức nào. Hơn nữa, tất cả đều miễn phí bạn à. Từ ngày có Blogspot, các website được sinh tự động ra đời ngày càng nhiều, và được gọi chung là Blog. Những người viết bài trên blog gọi là Blogger, công việc viết bài trên blog gọi là Blogging. Các khái niệm này ban đầu cơ bản là vậy. 2. Blogspot mạnh, nhanh, an toàn và miễn phí vĩnh viễn Chắc bạn đã từng nghe đến cái tên Google nhỉ? Vâng, Blogspot chính là con ruột của tập đoàn đang thống trị thế giới internet này. Chỉ nhiêu đó thôi đủ bạn hiểu được chất lượng của Blogspot cao như thế nào rồi. Những điểm nổi bật của Blogspot là tốc độ tải web nhanh, an toàn và gần nhƣ không thể bị hack cũng nhƣ bị tấn công. Các blog do Blogspot sinh ra có những chức năng và vẻ đẹp mà những website hàng đầu đều ao uớc. Đẹp và chuyên nghiệp THIẾT KẾ WEBSITE CHỈ BẰNG VÀI CLICK CHUỘT Copyright by BILLQUY.com Page 4 Ngoài ra, sử dụng Blogspot, bạn đã không phải bỏ công sức mà tất cả còn được miễn phí vĩnh viễn. Không những thế, Blogspot còn tạo cơ hội cho bạn kiếm được tiền và có thể là rất nhiều cơ đấy. 3. Và nhiều hơn thế nữa Đến với Blogspot, bạn có quyền chọn tên miền riêng cho blog của mình. Tên miền do Blogspot cung cấp ngắn, đẹp và có định dạng "TênDoBạnĐặt.blogspot.com". Đặt tên blog theo ý bạn Không như nhiều dịch vụ khác, chỉ cho bạn tạo ra 1 blog, Blogspot cho phép mỗi người tạo ra bao nhiêu blog tùy thích. Đặc biệt nhất, bạn có thể nói chuyện, trao đổi với những người xem blog của mình thông qua chức năng nhận xét. Hơn nữa, bạn còn có thể kết nối với các bạn bè cũng dùng Blogspot giống mình. Kết bạn tự do Và còn hàng tấn tấn những cái độc, hay, đỉnh mà Blogspot đang chờ bạn khám phá. Now, Let's Blogspot! THIẾT KẾ WEBSITE CHỈ BẰNG VÀI CLICK CHUỘT Copyright by BILLQUY.com Page 5 Phần 1: BẮT ĐẦU LÀM QUEN VỚI BLOGGER “Không phải những thứ chúng ta không biết khiến ta gặp rắc rối mà người lại” Mark Twain THIẾT KẾ WEBSITE CHỈ BẰNG VÀI CLICK CHUỘT Copyright by BILLQUY.com Page 6 Chƣơng 1: ƢU và NHƢỢC ĐIỂM CỦA BLOGGER Mình sử dụng blogger, mình thấy nó rất tốt để xây dựng hệ thống vệ tinh trong hệ thống web của bạn. Bạn dùng nó để làm Langding page, trang cá nhân, trong quảng cáo sản phẩm và nhiều mục đích khác. Trong quá trình làm mình thấy một số ưu và nhược điểm của Blogger như sau: 1. Ƣu điểm: - Blogspot là một phần của google nên khi search google nó hiện thị kết quả rất tốt - Giao diện của nó khá là thân thiện và dễ sử dụng. - Với blogspot thì việc lựa chọn phần thân cho blog cũng hết sức dễ dàng. - Việc thay đổi và chỉnh sửa trên blogspot cũng khá là đơn giản và dễ dàng. - Còn khi bạn muốn thay đổi toàn bộ thiết kế cũ bằng một thiết kế mới, bạn chỉ cần lưu lại một bản sao của mẫu trước khi bạn tiến hành những thay đổi mới ở phần chỉnh sửa html. - Blogspot cho phép bạn upload ảnh để trang trí ở thanh bên ngay từ trên máy tính của bạn, cũng như bạn có thể dẫn link ảnh từ trang khác. - Trang trí cho blog của mình những tiện ích như (đồng hồ, bướm bay, ….) chỉ bằng việc copy những đoạn code sẵn có và paste vào tiện ích html. - Với blogspot bạn cũng có thể chình màu chữ tùy theo ý thích của mình ở tất cả các phần của blog. (như màu chữ ở header, ở thanh bên…). 2. Nhƣợc điểm: - Cập nhật các comment ở mỗi bài viết chậm. Không liên kết trực tiếp được với trang web của người để lại comment. - Không tạo được liên kết trang kiểu tập con giống như Wordpress. - Chỉ có thể cập nhật những bài viết mới với những blogger có trong blogroll. - Không có chức năng cài đặt password cho bài viết mà mình muốn bảo mật. THIẾT KẾ WEBSITE CHỈ BẰNG VÀI CLICK CHUỘT Copyright by BILLQUY.com Page 7 Chƣơng 2: THAM KHẢO MỘT SỐ SẢN PHẨM LÀM TỪ BLOGGER 1. Những website của BillQuy tự tạo ra: Trong quá trình làm blogger mình đã tạo ra những trang web sau, đa phần chúng dùng để bán hàng: Trang web Mục đích 1. www.amalink.vn Trang chính của hệ thống đồng phục đà nẵng 2. www.aodongphucdn.com Chuyên cung cấp đồng phục doanh nghiệp 3. www.aolopdanang.com Chuyên cung cấp áo lớp cho sinh viên 4. www.aodongphucdanang.com Chuyên cung cấp đồng phục cho học sinh 5. www.aodoidanang.com Chuyên cung cấp áo đôi cho cặp tình nhân 6. www.billquy.com Website cá nhân của Bill Quy 2. Những website hữu ích cho bạn trong quá trình làm Blog Trang web Mục đích 1. www.namkna.blogspot.com/ Trang này cung cấp đầy đủ các tiện ích và thủ thuật nâng cao để tạo ra 1 blog cực kì chuyên nghiệp 2. www.billquy.com Mình sẽ gởi một vài thông tin về blogger và thủ thuật nâng cao mà mình đã thực hành được trên web này 3. Website tham khảo Trang web Mục đích 1. www.video.internetmarketing.vn 2. www.audio.internetmarketing.vn 3. www.slide.internetmarketing.vn 4. www.tuvan.internetmarketing.vn 5. www.book.internetmarketing.vn Những mẫu website tham khảo để bạn có thể có một website đẹp 4. Một số website thiết kế theo kiểu website Landing Page Trang web Mục đích 1. www.internetmarketingcoaching.vn 2. www.mega.internetmarketing.vn 3. www.bootcamp.internetmarketing.vn 4. www.autocashsystem.internetmarketing.vn 5. www.socialmedia101.vn 6. www.khoinghieptuhaibantaytrang.blogspot.com Những trang landing page đẹp mắt. THIẾT KẾ WEBSITE CHỈ BẰNG VÀI CLICK CHUỘT Copyright by BILLQUY.com Page 8 Chƣơng 3: HƢỚNG DẪN ĐĂNG NHẬP BLOGGER VÀ THIẾT KẾ WEBSITE CƠ BẢN 1. Hƣớng dẫn đăng nhập Blogger B1: Bạn phải có một tài khoản google (Gmail) Vd: billquy@gmail.com B2: Vào blogger và đăng nhập như đăng nhập Gmail B3: Nếu bạn là người đầu tiên vào blogger thì xem thêm B3 1/ Click 2/ Here 3/ Click 4/ Here 5/ Here 5/ Here 6./ Vào lại blogger.com thì giao diện sẽ nhƣ thế này THIẾT KẾ WEBSITE CHỈ BẰNG VÀI CLICK CHUỘT Copyright by BILLQUY.com Page 9 2. Thiết kế website cơ bản Click vào “BLOG MỚI” Tiến hành điền đầy đủ thông tin, có hai trƣờng hợp xảy ra. 1. Blog bạn định làm đã có người khác tạo, trường hợp này bạn tiến hành nhập lại cho đến khi được thì thô 2. Blog bạn định làm chưa ai tạo, thế là Ok – chúc mừng bạn -> Click vào “TẠO BLOG” [...]... BILLQUY.com Page 24 THIẾT KẾ WEBSITE CHỈ BẰNG VÀI CLICK CHUỘT Giải quyết câu hỏi 2: Tôi chỉ muốn có 2 Menu con của dòng “Giới Thiệu Bản Thân” thì làm như thế nào? Vào ”Mẫu”  “Chỉnh Sửa Mẫu” Bôi đen cả 3 đoạn “Mục Tiêu” Delete cả ba đoạn “Mục Tiêu” trên và click vào “Lƣu Mẫu” Vào web và nhấn F5 thì sẽ ra giao diện như sau: Copyright by BILLQUY.com Page 25 THIẾT KẾ WEBSITE CHỈ BẰNG VÀI CLICK CHUỘT Giải quyết...THIẾT KẾ WEBSITE CHỈ BẰNG VÀI CLICK CHUỘT Giao diện sẽ xuất hiện nhƣ thế này: Để vào trang điều khiển của Blogger bạn làm tƣơng tự nhƣ hình bên dƣới Đây là giao diện thiết kế, thông kê của Blog Copyright by BILLQUY.com Page 10 THIẾT KẾ WEBSITE CHỈ BẰNG VÀI CLICK CHUỘT Phần 2: HƢỚNG DẪN ĐĂNG BÀI CƠ BẢN VÀ NÂNG CAO “Nếu xe bị hỏng và... 300 pixel chiều rộng là vừa Copyright by BILLQUY.com Page 33 THIẾT KẾ WEBSITE CHỈ BẰNG VÀI CLICK CHUỘT Bạn copy đoạn Code bên dƣới Copy Code Vào phần thêm tiện ích của Blogger Kết quả đây: Copyright by BILLQUY.com Page 34 THIẾT KẾ WEBSITE CHỈ BẰNG VÀI CLICK CHUỘT  Còn cách thêm nút Like Facebook, Yahoo, Skyper, đoạn Slide flash thì bạn vào Website của mình hoặc lên google là có hết Mình sẽ cố gắng cập... Copyright by BILLQUY.com Page 18 THIẾT KẾ WEBSITE CHỈ BẰNG VÀI CLICK CHUỘT Phần 3: THAY ĐỔI GIAO DIỆN, TẠO THANH MENU, THAY ĐỔI HÌNH GIAO DIỆN “Đừng so sánh bản thân bạn với bất cứ ai khác trên thế giới này Nếu làm như vậy, bạn đang xúc phạm chính mình.” Bill Gates Copyright by BILLQUY.com Page 19 THIẾT KẾ WEBSITE CHỈ BẰNG VÀI CLICK CHUỘT Chƣơng 1: THAY ĐỔI GIAO DIỆN CHO WEBSITE Phần này Bill Quy sẽ làm... www.blogger.com, vào mục điều khiển chọn mẫu theo hình như sau: 2/ Sao lưu/khôi phục 1/ Click Mẫu Copyright by BILLQUY.com 3/ Click Here Page 20 THIẾT KẾ WEBSITE CHỈ BẰNG VÀI CLICK CHUỘT Upload Templates lên Vào blogger và Click vào “Xem Blog” thì bạn sẽ có một website như thế này, chỉ cần 3 click chuột bạn sở hữu cho mình một website với giao diện vô cùng đẹp, giúp bạn kinh doanh và mang về lợi nhuận cho... copy lƣu ảnh về máy tính và đặt tên ảnh bằng Từ Khóa bạn muốn SEO Copyright by BILLQUY.com Page 17 THIẾT KẾ WEBSITE CHỈ BẰNG VÀI CLICK CHUỘT Và sau đó Upload lên bài đăng của Blogger Click vào Upload Ảnh Đặt dấu nháy vào vị trí cần đặt ảnh Upload ảnh lên: Chỉnh sửa ảnh sau khi upload: Khi bạn click vào phần chỉnh sửa ảnh hiện ra một khung chỉnh sửa ảnh như trên, bạn chỉnh sửa sao cho phù hợp nhất theo... lượng view vào website của bạn Copyright by BILLQUY.com Page 14 THIẾT KẾ WEBSITE CHỈ BẰNG VÀI CLICK CHUỘT Bám nút SHARE hoắc CANCEL để xem bài viết Click vào xem website bên trên của vùng điều khiển bạn sẽ thấy giao diện như sau: Tương tự với cách làm này bạn đăng khoản 3 đến 5 bài đăng để khi chỉnh sửa mẫu và hoàn thiện website của bạn được đẹp hơn Lƣu ý: bài đăng của bạn có thể xóa hoặc chỉnh sửa tùy... làm như thế nào? Vào “Mẫu”  “Chỉnh sửa mẫu” Trỏ chuột vào vùng HTML và nhấn “Ctrl +F” Gõ chữ “Áo Lớp” Tiến hành Bôi Đên hết cả đoạn Code và nhấn Delete Nó sẽ hiện ra như thế này, chỉ còn Menu “Giới Thiệu Bản Thân” và “Áo Công Ty” Lƣu mẫu và vào web để xem kết quả Copyright by BILLQUY.com Page 26 THIẾT KẾ WEBSITE CHỈ BẰNG VÀI CLICK CHUỘT Giải quyết câu hỏi 4: Tôi muốn khi Click vào Menu thì nó ra một... thước vào ô sau Hoặc bạn có thể thiết kế ra 1 bức ảnh và Load lên Google + Copyright by BILLQUY.com Page 30 THIẾT KẾ WEBSITE CHỈ BẰNG VÀI CLICK CHUỘT B5: Copy URL ảnh mới tìm đƣợc B6: Thay thế ảnh trên web thành ảnh mới tìm Quay lại B1, thay thế dán URL ảnh mới tìm từ Google vào URL cũ của ảnh B7: Chiêm ngƣỡng kết quả đã làm: Lưu mẫu, vào lại website nhấn F5 để chiêm ngưỡng kết quả đạt được… Tương tự ta... nghĩ đến những người khuyết tật chỉ mong có thể tự bước đi vài bước” Danh Ngôn Cuộc Sống Copyright by BILLQUY.com Page 11 THIẾT KẾ WEBSITE CHỈ BẰNG VÀI CLICK CHUỘT Chƣơng 1: HƢỚNG DẪN ĐĂNG BÀI LÊN WEBSITE BẰNG CÁCH COPY và PASTE Bước vào mấy phần này hơi kỹ thuật một tí, các bạn kiên trì để tiếp tục con đường các bạn chọn nhé 1 Hƣớng dẫn sơ lƣợc về giao diện bài đăng Click vào nút “Bài Đăng Mới” Nó . THIẾT KẾ WEBSITE CHỈ BẰNG VÀI CLICK CHUỘT Copyright by BILLQUY.com Page 0 THIẾT KẾ WEBSITE CHỈ BẰNG VÀI CLICK CHUỘT Copyright by BILLQUY.com Page. trang landing page đẹp mắt. THIẾT KẾ WEBSITE CHỈ BẰNG VÀI CLICK CHUỘT Copyright by BILLQUY.com Page 8 Chƣơng 3: HƢỚNG DẪN ĐĂNG NHẬP BLOGGER VÀ THIẾT KẾ WEBSITE CƠ BẢN 1. Hƣớng dẫn. tật chỉ mong có thể tự bước đi vài bước” Danh Ngôn Cuộc Sống THIẾT KẾ WEBSITE CHỈ BẰNG VÀI CLICK CHUỘT Copyright by BILLQUY.com Page 12 Chƣơng 1: HƢỚNG DẪN ĐĂNG BÀI LÊN WEBSITE