Download to read offline
Uploaded byAshley Thompson
Smash.wordpress
This document provides an introduction to building a website using WordPress. It begins with introductions and explaining why WordPress is a good platform. It then covers choosing a domain name and hosting, installing WordPress, choosing and installing themes, and the anatomy of a website including sitemaps and wireframes. It also discusses blogs versus websites, setting up pages like the homepage, using plugins, basic HTML and CSS, and getting help. The document is a beginner's guide that aims to explain all of the essential steps for designing and building a basic WordPress website.
More Related Content
Smash.wordpress
- 1.
- 2.
- 3. A little aboutme! •Ashley Thompson •Owner of Smash Creative Services •I love branding, marketing, and design! •Inc. Magazine Military Entrepreneur •Wisconsin Native •Military wife, puppy mom, and entrepreneur! •Tweet me at @smash_creative
- 4. Why you shouldlisten to me We Make Websites! -At Smash we do Branding, Marketing, and Design -Your website has all 3 of these elements -Build a website that looks like your brand, is visually appealing, and is a great marketing tool
- 5. Why you shouldlisten to me
- 6.
- 7. Choosing Your Platform Whatis a Platform Some common platforms • Wordpress • Wix • SquareSpace • Ning • Weebly Today we are going to go over Wordpress, it is also my platform of choice
- 8. WHAT IS WORDPRESS? WordPressis a very popular content management system widely used today. It was first started for blogging but has grown as a tool to create and customize websites.
- 9. 7 Reasons touse Wordpress 1. SIMPLICITY WordPress is engineered to be as easy to use as possible. A vast majority of web servers support WordPress already, and installation is usually as easy as a one button click. If you can do basic edits to a Microsoft Word document, you have the skills already to edit web pages built on WordPress.
- 10. 7 Reasons touse Wordpress 2. MULTIMEDIA A text-only website can get very boring very quickly. You’ll need to engage your visitors with relevant photos, graphics, podcasts, maps, and videos. All of these are easy to manage, import, and use, thanks to WordPress’s impressive Media Library. Building a professional-looking photo gallery is just as easy, and you can do it in minutes without knowing a single line of code.
- 11. 7 Reasons touse Wordpress 3. THEMES The theme is the overall look of the site. It’s the colors, the layout of all the different sections, and the navigation that takes you around the site. Themes are easy to install (again, one-click) and there are thousands of different ones to choose from, most of which are free. Whatever the purpose or mood of your site, there’s a theme out there to fit it.
- 12. 7 Reasons touse Wordpress 4. Plug-ins WordPress has an amazing amount of functionality right out of the box. If you have more specific needs, the developer community has you covered. Plugins, which are simply packaged lines of code that quickly install and work with your existing site, help make your site more functional for your users. There are hundreds of free plugins that can provide all the advanced programming you need.
- 13. 7 Reasons touse Wordpress 5. CONTROL It’s your website and you decide how people interact with it. WordPress has a fully-functional user registration section which allows your visitors to maintain their own profiles on your site. You control what level of access users have, by group or the individual. You can even disable the whole registration system if you choose not to use it at all. Spam controls come standard with WordPress to keep out unwanted attention.
- 14. 7 Reasons touse Wordpress 6. POWERFUL BLOGGING ENGINE WordPress started as a blogging platform. Although it’s grown far beyond that to a fully-functional website platform, it hasn’t forgotten its roots. Your website is only going to survive if the content on it is fresh and relevant. The blogging engine built into WordPress allows you to effortlessly update your company’s blog (or ‘News/Events’ section), so that your clients or customers are always kept in the loop.
- 15. 7 Reasons touse Wordpress 7. EXCELLENT SEO A website is only relevant if it can be found by your target audience. The higher your site ranks when someone searches for it, the more likely it will be read. Search Engine Optimization (SEO), involves properly coding your website so that search engines like Google and Bing will find it easier, and rank it higher. The code generated by WordPress has been engineered to give you the best SEO possible. Matt Cutts, the senior search engineer at Google, has even mentioned WordPress specifically as being capable of ranking higher in search results.
- 16. “SELF-HOSTED” vs. “HOSTED” And whyyou need to choose the right one. WordPress has two platforms • wordpress.com • wordpress.org. Choosing the right one depends on your website needs, budget and technical skills.
- 17. WORDPRESS.COM Pros of .com •Free with domain • Hosted by WordPress • Fairly easy to Set-up Cons of .com • No plugins • Limited themes • Limited control Is .com right for you? .com is the best platform for people who want free hosting and don’t want to deal with technical aspect of their website. With .com, you write your content but have limited control over design.
- 18. WORDPRESS.ORG Pros of .org •Thousands of plugins • Freedom to design • Own domain Cons of .org • Need hosting • More technical • Own spam protection Is .org right for you? .org is the best platform for people who want control over their website. With .org, you have the freedom to add your brand and design a custom website.
- 19. HOW TO BUYA DOMAIN AND WEB HOSTING 1.) Pick a name that helps brand your company -keep it short and easy to remember 2.) Search to see if your name is available 3.) Register your name with websites such as register.com, domain.com or godaddy.com
- 20. INSTALLING WORDPRESS WordPress canbe VERY easy to install! In fact, you can have it installed in under 5-minutes! WordPress can be installed in the following ways. • 5-Minute Installation • One click installation (some hosting websites)
- 21. 5-Minute (Manual) Installation 1.)Go to www.wordpress.org to download the latest version of WordPress and unzip the contents of the file. 3.) Create a database for WordPress on your webserver. 3.) Upload the WordPress files to your webserver 4.) Enter your database information For a more detailed version visit http://codex.wordpress.org/Installing_WordPress
- 22. Video to getStarted! Buying your Domain and Hosting Installing Wordpress http://www.tubechop.com/watch/1530272
- 23. 5-Minute (Manual) InstallationVideo http://www.youtube.co m/watch?v=ell0SiTZyX8
- 24.
- 25. CHOOSING A THEME Themesare your chance to add your personality to your website. You can search pre-existing themes within WordPress or even make your own customized theme. Choose a theme that… • • • • Goes with your brand Offers the best function for your product/service Works on all browsers Offers a support
- 26. HOW TO INSTALLAND ACTIVATE THEMES Installing themes can seem daunting at first, but WordPress makes the process fairly simple. WordPress comes with two available themes upon setup. 1.) First select the appearance panel followed by themes. 2.) Click on install themes 3.) Search the name of your chosen theme, click on existing theme, browse themes, or upload your own!
- 27. Suggested Themes Thesis (paid) •drag and drop skins • no coding required to run theme Free Themes If you are on a budget or still learning your layout play with free themes Paid Themes You can pay for themes that fit your design and layout tastes. Elegant Themes is a great example. Thesis Layout Example from http://diythemes.com/
- 28. 2013 Theme The 2013theme for WordPress takes us back to the blog, featuring a full range of post formats, each displayed beautifully in their own unique way. Design details abound, starting with a vibrant color scheme and matching header images, beautiful typography and icons, and a flexible layout that looks great on any device, big or small. http://www.tubechop.com/watch/1530297
- 29.
- 30. THE ANATOMY OFYOUR WEBSITE An important and often overlooked step to creating your website! Creating a sitemap, wireframe and a style board can help with the process of choosing the right anatomy for your website.
- 31. Sitemap A sitemap isthe layout is the order of navigation on your website. This has a lot to do with marketing. You have to know the goal of the site and drive your visitors to perform that action. 3-click rule-Important information should never be more than 3 clicks away.
- 32. Wireframe Creating a wireframeis basically a placement of where you want content on your site. Figure out what each page is going to have on it and what elements you want to add on each page. But-Also find a theme that will work with your layout. Some themes will restrict the layouts you can have. Or-Create a Wireframe with your theme in mind.
- 33. Style Board Designing astyle board can help create a mood for your website and save time by collecting items to organize thoughts before jumping into your website.
- 34.
- 35. BLOG, WEBSITE, ORBOTH: Picking Your Site Format Each format has their positives and negatives. Choosing the format depends on many factors. You want to take a look at your business and marketing goals. Having both is usually the best option for most businesses.
- 36. BLOG, WEBSITE, ORBOTH: Picking Your Site Format Advantages of a Blog • Bring traffic to your website • SEO • Invite viewers to check often to see if new content is added Disadvantages of a Blog • Upkeep • Timely • Finding new topics
- 37. BLOG, WEBSITE, ORBOTH: Picking Your Site Format Advantages of a Website • Informs viewers about your product/service Disadvantages of a just Website • One-way communication (no comments)
- 38. BLOG, WEBSITE, ORBOTH: Picking Your Site Format Why Both? My content marketing spiel…..and Marcus Sheridan! http://www.youtube.com/watch?v=0sv2tLYE0R0
- 39. DECIDING ON THELAYOUT OF YOUR SITE (How Many Columns, and Where to Put Them) The layout is the foundation (building blocks) of your website. If you don’t have a strong foundation, the website will fall apart. • Keep the layout consistent • Strive for simplicity (clear and organized content) • Be creative (think of showcasing your brand) • Content is Key!
- 40. HOW TO SETUPYOUR HOMEPAGE Posts or Static Content? • To have your home page as a static page you need to edit your settings. • Static page vs blog posts page • When would you want the blog on the first page? • Your Homepage is your most important page-think about your call to action. • Important items “above the fold”
- 41. SEARCH BAR &SOCIAL MEDIA ICONS Putting Them Where it Counts • Why have a search bar • Legality of Social Media Icons • What Social Media should you list? • You have to look at your website as the core of your business but social media is where the conversations take place. Social Media will drive people to your site.
- 42.
- 43. GATHER EMAIL ADDRESSES •Why should you have an email list? • Use your website to grow your list. • Adding the code to your site. • http://www.constantcontact.com
- 44. INTRO TO PLUGINS HowThey Work and How to Install Them Adding plugins to your website can greatly change the way your website functions. To install a plugin click on 1.) administration panel 2.) plugins 3.) add new 4.) install now 5.) activate
- 45. INTRO TO PLUGINS Facebook& Twitter • Twitter no longer supports plugins • Using Code rather than a plug-in to install Facebook and Twitter Feeds. • Many Facebook options! • Like Button • Like Box • Recommend • Feed
- 46. Yoast SEO Plug-in http://www.youtube.com/watch?v=KQF8WP4iHec Whatis SEO? Why is it important?
- 47. INTRO TO HTML &A TOUCH OF CSS
- 48. HTML COMMUNICATING WITHYOUR BROWSER How HTML tells your browser what to do with your site • HTML is the language of the web. • Html is created using tags. Tags generally are in pairs with an opening tag and a closing tag. • HTML tells your browser what it’s purpose is. For example, HTML differentiates between a heading, subheading, and body content using tags.
- 49. Inspector • Right Clickand View Source to see the html of a page • Use the Inspector-Great tool to learn and play with html
- 50. BASIC HTML TAGSTO KNOW <html> html document </html> <head> header </head> <body> body content </body> <p> paragraph </p> <h1> text heading </h1> <h2> sub heading </h2> <strong> strong emphasis (bold) </strong> <ol> ordered list </ol> <form> form </form>
- 51. CSS STYLE RULES CSS(cascading style sheets) can transform the look and format of your website. Two Types of CSS Styles • HTML Elements -automatically applies to certain HTML tags • Class -applies to specific objects and content
- 52. USING CSS To Alterthe Look of *Anything* on Your Site • Padding • Margins • Color • Borders • Height • And much, much more!
- 53. CSS AND COLOR ARainbow at Your Fingertips • Colors are created for the web using a combination of RGB (Red, Green, Blue) to form a hexadecimal. • The color values of the hexadecimals always start with # and have a combination of letters and numbers to form any given color. • Just because you have the rainbow at your fingertips, doesn’t mean you should use all the colors. Keep things consistent with your brand. • When choosing colors for text, opt for a color that is easy for the eyes to read.
- 54. Where in Wordpressyou see it • You can view the html editor within the pages of Wordpress. Sometimes knowing the code helps with building the content within your pages. • As you learn more you can use it to change elements in the site that the regular options don’t let you change.
- 55. What if Ineed Help?
- 56. Options for Help •Wordpress is very commonly used. There are many many videos online for any problem you may be having. • The Wordpress Website is a great resource. • Keep learning! Wordpress for Dummies is a good book to reference. • Web Designers have the ability to build a completely custom site within the Wordpress Platform. You will still have the ability to update, they will provide the design. • If you need a more advanced site there are a few things to look for in a Web Design Company
- 57. Hiring a WebDesign Company • If you need to take the plunge and hire a designer there are a few things to look for. • Will they be around for a while-I have seen many clients who had a friend or freelancer build a site and they were nowhere to be found when updates needed to be made • Expertise-Designers should also have a marketing mentality. It needs to look great and get you more business! • Trust-Find someone you enjoy working with. It can be a long process so a great relationship is key. • Ask for referrals!
- 58. How Much DoesIt Cost? • The cost of building a website is like asking how much it is to build a house. • Set your budget and build a plan in your budget. Many designers will tell you what is possible with your budget. • You get what you pay for. A good company or designer may be an investment, but could make a huge impact on the success of your business. • Ask about SEO • Look at their portfolio to see if their style is a fit
- 59. Let’s Dive In •Let’s use this time to dive into Wordpress and start creating our site! • Good Video that also walks through 2013http://www.youtube.com/watch?v=DxlLibzteHs