{"id":518,"date":"2014-04-03T05:53:27","date_gmt":"2014-04-03T10:53:27","guid":{"rendered":"http:\/\/art.buffalo.edu\/coursenotes\/art320\/?page_id=518"},"modified":"2025-11-20T13:13:24","modified_gmt":"2025-11-20T18:13:24","slug":"exercise-6-installing-wordpress-and-creating-a-child-theme","status":"publish","type":"page","link":"https:\/\/ubwp.buffalo.edu\/art320\/exercises\/exercise-6-installing-wordpress-and-creating-a-child-theme\/","title":{"rendered":"Exercise 6: Getting Started with WordPress"},"content":{"rendered":"\n<h2 class=\"wp-block-heading\">Part 1: Configure Your WordPress Site<\/h2>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Login to your ubuffalo.art WordPress dashboard. You&#8217;ll find it at UBITNAME.ubuffalo.art\/wp-admin.<\/li>\n<\/ol>\n\n\n\n<p>2. Complete initial site setup:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>In Settings&gt;General, review your Site Title , Tagline and your email&nbsp;address (for admin purposes.)<\/li>\n\n\n\n<li>Change the Administrator email to your UB email address.<\/li>\n\n\n\n<li>Note the box for <em>Membership: Anyone can register<\/em>. DO NOT check this box.<\/li>\n\n\n\n<li>Set the Time Zone for New York<\/li>\n\n\n\n<li>Uncheck the box &#8220;Allow people to submit comments on new posts&#8221;<\/li>\n\n\n\n<li>Check the box &#8220;Before a comment appears&gt;Comment must be manually approved&#8221;<\/li>\n\n\n\n<li>Save Changes<\/li>\n<\/ul>\n\n\n\n<p>3. In Settings&gt;Discussion, you can choose to allow visitors to leave comments on posts and pages.<\/p>\n\n\n\n<p>4. Create a New Page. Type &#8220;Home&#8221; in the <em>Title<\/em> block. Click the <strong>+<\/strong> icon to choose a block type. Click <strong>Browse All<\/strong>, then click <strong>Patterns<\/strong>.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Click Banners, then find a thumbnail to add the Pattern to your page.<\/li>\n\n\n\n<li>Select the new block and look at the Settings, Block styles. Upload images or change styles as needed. (You may use <a href=\"https:\/\/ubwp.buffalo.edu\/art320\/wp-content\/uploads\/sites\/103\/2025\/10\/IMG_8716-scaled.jpeg\" target=\"_blank\" rel=\"noreferrer noopener\">this image<\/a> or any other.)<\/li>\n\n\n\n<li>Add some additional block types for content, including subheads, paragraphs and lists. Note the URL (permalink) assigned to the page will contain the Title you entered. <strong>Publish<\/strong> the page.<\/li>\n<\/ul>\n\n\n\n<p>5. Create a New Page. Title it &#8220;Contact&#8221;.<\/p>\n\n\n\n<p>6. Create a New Page. Title it &#8220;Work&#8221;.<\/p>\n\n\n\n<p>7. Create a New Page. Title it &#8220;Design&#8221;.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Under page attributes, make Design a child of Parent: Work.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image size-large is-resized has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"1024\" src=\"https:\/\/ubwp.buffalo.edu\/art320\/wp-content\/uploads\/sites\/103\/2025\/10\/Screenshot-2025-10-22-at-17.08.57-1024x1024.png\" alt=\"Choose a Parent Page\" class=\"wp-image-4274\" style=\"border-width:2px;width:341px;height:auto\" srcset=\"https:\/\/ubwp.buffalo.edu\/art320\/wp-content\/uploads\/sites\/103\/2025\/10\/Screenshot-2025-10-22-at-17.08.57-1024x1024.png 1024w, https:\/\/ubwp.buffalo.edu\/art320\/wp-content\/uploads\/sites\/103\/2025\/10\/Screenshot-2025-10-22-at-17.08.57-300x300.png 300w, https:\/\/ubwp.buffalo.edu\/art320\/wp-content\/uploads\/sites\/103\/2025\/10\/Screenshot-2025-10-22-at-17.08.57-150x150.png 150w, https:\/\/ubwp.buffalo.edu\/art320\/wp-content\/uploads\/sites\/103\/2025\/10\/Screenshot-2025-10-22-at-17.08.57-768x767.png 768w, https:\/\/ubwp.buffalo.edu\/art320\/wp-content\/uploads\/sites\/103\/2025\/10\/Screenshot-2025-10-22-at-17.08.57.png 1434w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>8. Create a new page, Blog, and in Settings&gt;Reading set it as your Posts Page.&nbsp;<\/p>\n\n\n\n<p>9. In Settings&gt;Reading, Change the landing page to Static Page: Home.<\/p>\n\n\n\n<p>10. Create a New Post. Title it &#8220;Welcome to My Blog&#8221; or something equally exciting.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Embed a YouTube video by pasting the URL of the video of your choice into a WordPress block.<\/li>\n\n\n\n<li>Add links to your blog post.<\/li>\n\n\n\n<li>Add a list.<\/li>\n\n\n\n<li>Assign relevant <strong>Categories<\/strong> and <strong>Tags<\/strong> to help visitors find your content.<\/li>\n\n\n\n<li><strong>Publish<\/strong> the Post.<\/li>\n<\/ul>\n\n\n\n<p>11. Visit your site to see your new content. Select different themes (Appearance&gt;Themes) and notice the changes to the design.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Part 2: Install a Theme and Edit Appearance<\/h2>\n\n\n\n<p>&nbsp;1. In Appearance&gt;Themes, choose <strong>Add Theme<\/strong> and search for Ollie<\/p>\n\n\n\n<p>2. Activate the new Ollie&nbsp;theme. View the site and observe the theme&#8217;s default features. Notice the Menu appears with the pages out of optimal order. We&#8217;ll fix that below.<\/p>\n\n\n\n<p>3. In the Dashboard, go to Appearance&gt;Editor<\/p>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" width=\"766\" height=\"178\" src=\"https:\/\/ubwp.buffalo.edu\/art320\/wp-content\/uploads\/sites\/103\/2025\/10\/Screenshot-2025-10-22-at-16.36.09-1.png\" alt=\"Appearance&gt;Editor\" class=\"wp-image-4273\" style=\"width:426px;height:auto\" srcset=\"https:\/\/ubwp.buffalo.edu\/art320\/wp-content\/uploads\/sites\/103\/2025\/10\/Screenshot-2025-10-22-at-16.36.09-1.png 766w, https:\/\/ubwp.buffalo.edu\/art320\/wp-content\/uploads\/sites\/103\/2025\/10\/Screenshot-2025-10-22-at-16.36.09-1-300x70.png 300w\" sizes=\"auto, (max-width: 766px) 100vw, 766px\" \/><\/figure>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" width=\"680\" height=\"738\" src=\"https:\/\/ubwp.buffalo.edu\/art320\/wp-content\/uploads\/sites\/103\/2025\/10\/Screenshot-2025-10-22-at-16.54.14.png\" alt=\"Edit&gt;Design\" class=\"wp-image-4272\" style=\"width:278px;height:auto\" srcset=\"https:\/\/ubwp.buffalo.edu\/art320\/wp-content\/uploads\/sites\/103\/2025\/10\/Screenshot-2025-10-22-at-16.54.14.png 680w, https:\/\/ubwp.buffalo.edu\/art320\/wp-content\/uploads\/sites\/103\/2025\/10\/Screenshot-2025-10-22-at-16.54.14-276x300.png 276w\" sizes=\"auto, (max-width: 680px) 100vw, 680px\" \/><\/figure>\n\n\n\n<p>4. Click &#8220;Navigation&#8221;<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Drag to change the order of the menu items: Home, Contact, Work.<\/li>\n\n\n\n<li>Drag Design into the Work item to make it a subpage.<\/li>\n\n\n\n<li>Remove Sample Page.<\/li>\n\n\n\n<li>Click &#8220;Review Change\u2026&#8221; at the bottom, the Left Arrow to get back to Dashboard.<\/li>\n\n\n\n<li>Click Visit Site from under the Home icon at the top left.<\/li>\n<\/ul>\n\n\n\n<p>5. Back in Appearance&gt;Editor, click Styles. Explore changing\/adding fonts, colors effects, and general layout attributes.<\/p>\n\n\n\n<p>6.In Appearance&gt;Editor, click Patterns, the Footer.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" width=\"552\" height=\"628\" src=\"https:\/\/ubwp.buffalo.edu\/art320\/wp-content\/uploads\/sites\/103\/2025\/10\/Screenshot-2025-10-22-at-17.32.59.png\" alt=\"Appearance&gt;Editor, click Patterns, the Footer\" class=\"wp-image-4277\" style=\"width:267px;height:auto\" srcset=\"https:\/\/ubwp.buffalo.edu\/art320\/wp-content\/uploads\/sites\/103\/2025\/10\/Screenshot-2025-10-22-at-17.32.59.png 552w, https:\/\/ubwp.buffalo.edu\/art320\/wp-content\/uploads\/sites\/103\/2025\/10\/Screenshot-2025-10-22-at-17.32.59-264x300.png 264w\" sizes=\"auto, (max-width: 552px) 100vw, 552px\" \/><\/figure>\n\n\n\n<p>Click the Footer thumbnail. You can now edit the contents of the Footer. <\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Add or remove social media icons<\/li>\n\n\n\n<li>Delete content that is not needed.<\/li>\n\n\n\n<li>Click Save when finished.<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">Part 3: Add and Activate Plugins<\/h2>\n\n\n\n<p>Plug-ins add a wide-variety of functionality to your WordPress site.<\/p>\n\n\n\n<p>Ensure that the plugins you choose to install are used by a great number of users and have been updated recently.<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>From your WordPress dashboard, go to Plugins and click &#8220;<strong>Add New<\/strong>&#8220;.<\/li>\n\n\n\n<li>Search for &#8220;<strong>wpForms<\/strong>&#8220;. <strong>Install<\/strong> and <strong>Activate<\/strong>.<\/li>\n\n\n\n<li>Search for &#8220;<strong>NextGEN Gallery<\/strong>&#8220;. Ensure that your found result in by developer &#8220;Imagery&#8221;. Click &#8220;<strong>Install Now<\/strong>&#8220;, then Activate. (Optionally, view the <a href=\"https:\/\/youtu.be\/4Phvmm3etnw\">NextGEN Gallery intro video<\/a>.)<\/li>\n\n\n\n<li>Download these <a href=\"https:\/\/buffalo.box.com\/s\/lwfcrvggh7rmxiiotgrd07iji441z6l3\" target=\"_blank\" rel=\"noreferrer noopener\">four sample images<\/a> (or quickly find your own.)<\/li>\n\n\n\n<li>To create a gallery with the four images, and place it on your Work page:\n<ul class=\"wp-block-list\">\n<li>From your dashboard, go to Media&gt;Library and drag-and-drop your image files into the library. Review how to add metadata to each image.<\/li>\n\n\n\n<li>From your dashboard, go to NextGEN Gallery&gt;Add Gallery\/Images.<\/li>\n\n\n\n<li>Click to &#8220;Import From Media Library&#8221;. Type in a New Gallery Title, then click Select Images.<\/li>\n\n\n\n<li>Click the Media Library Tab at the top. Shift-click (Mac) to select multiple images from your Media Library. Hit the Select Button and the bottom-right.<\/li>\n\n\n\n<li>Click the button to &#8220;Import Images&#8221;.<\/li>\n\n\n\n<li>Edit your Work page. Click to add a new block and search for NextGEN. Add the block, and choose your new gallery from the list. Save and view your page.<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li>Alternative image plug-in: <a href=\"https:\/\/djlicata.ubuffalo.art\/wp-admin\/plugin-install.php?tab=plugin-information&amp;plugin=ultimate-addons-for-gutenberg&amp;TB_iframe=true&amp;width=600&amp;height=550\">Spectra Gutenberg Blocks \u2013 Website Builder for the Block Editor<\/a>, for hover effects, get over image, and Lightbox (as well as other useful design block types.)<\/li>\n\n\n\n<li>In the Dashboard, click <strong>WP Forms<\/strong>, and click +Add New.\n<ul class=\"wp-block-list\">\n<li>Click &#8220;Simple Contact Form&#8221; and Use Template.<\/li>\n\n\n\n<li>Click Notifications. Review the Send to address.<\/li>\n\n\n\n<li>Click Confirmations. review the message that your senders will see once their form is submitted.<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li>Edit your <strong>Contact<\/strong> page. Click to add a new block and search for &#8220;WPForms&#8221;. Add the block, and select the &#8220;Simple Contact Form&#8221; from the menu. Save and view your page.<\/li>\n\n\n\n<li>Add Google Fonts to your theme: <a href=\"https:\/\/djlicata.ubuffalo.art\/wp-admin\/plugin-install.php?tab=plugin-information&amp;plugin=olympus-google-fonts&amp;TB_iframe=true&amp;width=600&amp;height=550\">Fonts Plugin | Use Google Fonts, Adobe Fonts or Upload Fonts<\/a>.<\/li>\n<\/ol>\n\n\n\n<h3 class=\"wp-block-heading\">Alternative Image Gallery Plugins:<\/h3>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/wordpress.org\/plugins\/modula-best-grid-gallery\/\">Modula<\/a>: Nice mosaic-grid layout function<\/li>\n\n\n\n<li><a href=\"https:\/\/wordpress.org\/plugins\/simple-lightbox\/\">Simple Lightbox<\/a> (for the image enlargement effect without having to create galleries.)<\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>Part 1: Configure Your WordPress Site 2. Complete initial site setup: 3. In Settings&gt;Discussion, you can choose to allow visitors to leave comments on posts and pages. 4. Create a [&hellip;]<\/p>\n","protected":false},"author":295,"featured_media":0,"parent":35,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_EventAllDay":false,"_EventTimezone":"","_EventStartDate":"","_EventEndDate":"","_EventStartDateUTC":"","_EventEndDateUTC":"","_EventShowMap":false,"_EventShowMapLink":false,"_EventURL":"","_EventCost":"","_EventCostDescription":"","_EventCurrencySymbol":"","_EventCurrencyCode":"","_EventCurrencyPosition":"","_EventDateTimeSeparator":"","_EventTimeRangeSeparator":"","_EventOrganizerID":[],"_EventVenueID":[],"_OrganizerEmail":"","_OrganizerPhone":"","_OrganizerWebsite":"","_VenueAddress":"","_VenueCity":"","_VenueCountry":"","_VenueProvince":"","_VenueState":"","_VenueZip":"","_VenuePhone":"","_VenueURL":"","_VenueStateProvince":"","_VenueLat":"","_VenueLng":"","_VenueShowMap":false,"_VenueShowMapLink":false,"footnotes":""},"class_list":["post-518","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/ubwp.buffalo.edu\/art320\/wp-json\/wp\/v2\/pages\/518","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ubwp.buffalo.edu\/art320\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/ubwp.buffalo.edu\/art320\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/ubwp.buffalo.edu\/art320\/wp-json\/wp\/v2\/users\/295"}],"replies":[{"embeddable":true,"href":"https:\/\/ubwp.buffalo.edu\/art320\/wp-json\/wp\/v2\/comments?post=518"}],"version-history":[{"count":67,"href":"https:\/\/ubwp.buffalo.edu\/art320\/wp-json\/wp\/v2\/pages\/518\/revisions"}],"predecessor-version":[{"id":4328,"href":"https:\/\/ubwp.buffalo.edu\/art320\/wp-json\/wp\/v2\/pages\/518\/revisions\/4328"}],"up":[{"embeddable":true,"href":"https:\/\/ubwp.buffalo.edu\/art320\/wp-json\/wp\/v2\/pages\/35"}],"wp:attachment":[{"href":"https:\/\/ubwp.buffalo.edu\/art320\/wp-json\/wp\/v2\/media?parent=518"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}