EDCI 270 Coding Instruction. Linking

Similar documents
How to Edit Your Website

Home page layout in Canvas

QRG: Adding Images, Files and Links in the WYSIWYG Editor

How to Edit Your Website

Adding Text and Images. IMCOM Enterprise Web CMS Tutorial 1 Version 2

QRG: Using the WYSIWYG Editor

Toufee Banner Rotator User Guide

Layout Manager - Toolbar Reference Guide

Setting Up the Fotosizer Software

Websites. Version 1.7

Arch Guide Creating an Instructional Plan

Table of contents. DMXzone Nivo Slider 3 DMXzone

Advanced Marketing Techniques: Zach Stone, Molly McCormick, Dave Frees, Connie Gray, Karen Martin, and Mischelle Davis

NVU Web Authoring System

IMAGE LINKS - INTRODUCTION

Centricity 2.0 Section Editor Help Card

USER GUIDE PowerPhoto CRM

Step 5 How to download free Music from YouTube You need a YouTube account to download free Music from YouTube. If you don t have a YouTube account,

AGENT123. Full Q&A and Tutorials Table of Contents. Website IDX Agent Gallery Step-by-Step Tutorials

Index. Smart Image Processor PHP 2 Manual DMXzone.com

Creating a Website in Schoolwires Technology Integration Center

Google Docs: Access, create, edit, and print

The <img> Element. To place an image on our web page, we use the self-closing <img> element:

NETZONE CMS User Guide Copyright Tomahawk

Uploading Videos to your Website

Login: Quick Guide for dotcms & Accessibility April 2016 Training:

Step 4 Part F - How to Download a Video on YouTube and Delete a Video

Video Embedder. Plugin for Joomla! This manual documents version 9.x of the Joomla! extension.

Table of Contents. Access to CMS Your sites Workspace tour Pages and Sidebar Files and Images Build a web page...

The Etomite Manual for website editors.

Sparqube Picture Column App

Microsoft Sway. Contents

How to Edit Your Website

Volunteer User Groups: CMS User Guide. September 2014

Moodle plugin for the Online Video Service (OVS)

Working with Confluence Pages

Image Management Guideline Managing Your Site Images

Quick Reference Guide WEBSITE MESSAGING TOOLS ACCESSIBILITY

Dreamweaver Basics Workshop

How to Use Moodle's Text Editor

ewebrenter Online Media Administration: User Guide

Exhibitor Area User Guide

Index. Smart Image Processor 2 Manual DMXzone.com

HTML Lab Exam CA106 CA1 Friday 9 th April 2004

General Training Curriculum

eportfolios First, request for an account through

Kinetika. Help Guide

The Ultimate Social Media Setup Checklist. fans like your page before you can claim your custom URL, and it cannot be changed once you

WordPress How to Create a Simple Image Slider with the New RoyalSlider

CMS Editing SomersetYFC.co.uk

SeaMonkey for PC. Getting Started Adding Links Adding Colors, Images, and Style Loading into D2L

CMS Editing LesAlpesDazur.com

Headlines & Features App Guide

P a g e 0. CIDRZ Website Manual.

KS Blogs Tutorial Wikipedia definition of a blog : Some KS Blog definitions: Recommendation:

Dreamweaver Basics. Planning your website Organize site structure Plan site design & navigation Gather your assets

Step 1: Now you will be directed to the cloned profile that you created. Click on the "UI setting"

Blogger Frequently Asked Questions

ACADEMIC TECHNOLOGY SUPPORT Advanced OU Campus: 2014 Template Asset Image Gallery using Photoshop

EventsNow. Getting Started Guide

Embed a Google File in a Google Site Page

AGLOWNET WORDPRESS HOW-TO

Lava New Media s CMS. Documentation Page 1

Website Creating Content

ADRION PROJECT WEBSITES USER S MANUAL

Image Rights Options: Using Bands, Brands and Watermarks

Step 1 Download and Install KompoZer Step by step instructions to build your first web page using KompoZer web editor.

Upload Materials to Your Dossier Account

About Netscape Composer

This Tutorial is for Word 2007 but 2003 instructions are included in [brackets] after of each step.

Documentation English v1

Web Manager 2.0 User s Manual Table of Contents

Do It Yourself Website Editing Training Guide

RIX Wiki User Guide 1

Step 7 How to convert a YouTube Video to Music As I mentioned in the YouTube Introduction, you can convert a Video to a MP3 file using Free Video To

ADJUST TABLE CELLS-ADJUST COLUMN AND ROW WIDTHS

A Dreamweaver Tutorial. Contents Page

Page 1 of 11 Wordpress Sites How-to Guide. Introduction to Blogging -

Drupal User Guide for Authors

Editing the Home Page

Using YouTube with your Mahara eportfolio

Flash Album Generator 2 Manual Version 1.0. About Flash Album Generator 2. Flash Album Generator 2 Manual version 1.0 DMXzone.com

Linn-Mar Staff Web Page Setup

AGENDA :: MULTIMEDIA TOOLS :: CLASS NOTES

HTML coding basics. 1. HTML coding, what is it? 2. Form a paragraph. 3. Insertion of a link. 4. Insertion of an image. Text alignment Line break

User Manual. Page-Turning ebook software for Mac and Windows platforms

Create a Contact Sheet of Your Images Design a Picture Package Customize Your Picture Package Layout Resample Your Image...

Dozuki. Written By: Dozuki System

Website Administration Manual, Part One

Working with Images and Multimedia

CPAC. Bookmark CPAC 1

Objectives. Tutorial 8 Designing ga Web Site with Frames. Introducing Frames. Objectives. Disadvantages to Using Frames. Planning Your Frames

Each physical sign is represented by a Redirect page. A URL will be provided for this page and your sign will always load that URL.

TEACHER: CREATE PRACTICE QUIZ

File Cabinet Manager

ITEC447 Web Projects CHAPTER 10 FLASH & SILVERLIGHT 1

AGENDA. EMBEDDING FONTS [ Font Files & CSS font-family ] :: Online Font Converter :: ADD font-family css code to style.css

Basic Content Management Introduction

Copyright 2012 Anthony Hortin

There are a few things that some of you may be worried about, so here is a list of what Picasa will not do for those that may be concerned.

Transcription:

EDCI 270 Coding Instruction Linking 1. Anchored Links (links that jump/move to a different part of the same page) a. These are the links that will be in your table of contents. b. Code Example: This is what will appear in your table of contents. [History #history] - The word after the # is the key word. - The word that comes before the is what will appear in your document. - This can only be 1 word. - This should be lowercase. To link to a lower part of the document place this in that area: History {anchor:history} - Use the keyword after the : to link to this part of the document. - This needs to be the exact same word used in the link above. 2. External Links (links that go to a different website) a. To link to a website that is outside of the wiki, place the url inside of these [ url ] see example: - [http://www.purdue.edu] - The text of the link will appear in the wiki. b. If you want text to appear instead of the URL create the link like the following example: - [Purdue University http://www.purdue.edu] - The information before the is what will appear in the wiki. - The part after the needs to be a correct URL.

Images 1. Google Images (http://images.google.com) a. For this example, we are going to look for the Purdue logo. b. Type in Purdue Logo in the search box and click search. c. After you have done this, the results page will appear. Just below the search box, there will be a show options dialog. Click that. d. Click on the Larger Than Link and select 400x300. Any image smaller than that will most likely be too small or poor resolution. e. You can also do this by clicking on Advanced Image Search to the right of the search box and viewing the size option and selecting Images that are larger than 400x300. f. If the images are above 800 pixels wide you will want to resize them. See next tutorial. 2. Resizing Images a. Save your large image to your computer. b. Go to http://www.picresize.com/ c. Upload the image to this website. d. It will then give you the option to resize.

e. Select Custom Size. f. ONLY put in a width for the image. Do not put a width and a height. g. Put the width that you want (anything less than 800px) and change the dropdown menu from percent to pixels. h. You shouldn t need to apply any special effects. i. At the bottom, select JPG and click Resize Pic! j. This will bring you to another screen. You should then select Save Image to Disk. k. Now you re ready to insert the saved image into the wiki. 3. Inserting Images into Wiki s a. You can do this in Wiki Markup Mode and Rich Text. b. Here is how to do it in Wiki Markup Mode: c. Click on the insert image icon at the top of the page. d. Click browse and select your image. Make note of the Filename as you will use it in the next steps. e. Your image will upload an a thumbnail will appear in the Insert Image box. f. Click OK. g. To insert your image into the document place the filename between two! points like this: i.!filename.jpg! h. It will now appear in the document. 4. Centering Images a. To center the image that you inserted into your Wiki, add align=center after the file name. See example: i.!filename.jpg align=center!

Tables 1. Table of Contents a. To create a table in your Wiki, place text and elements between b. This will make one row with two columns: Row 1, Column 1 Row 1, Column 2 c. This will make a table with two rows and three columns: Row 1, Column 1 Row 1, Column 2 Row 1, Column 3 Row 2, Column 1 Row 2, Column 2 Row 2, Column 3 d. Make sure you don t put an extra space between the two lines of text or you will create two separate tables with one row: Row 1, Column 1 Row 1, Column 2 Row 1, Column 3 Row 2, Column 1 Row 2, Column 2 Row 2, Column 3 e. Adding a \\ after a line will allow you add elements to additional lines: Row 1, Column 1 Row 2 column 2 \\ Row two, column 2, line two Row 2, Column 1 Row 2, Column 2 \\ Row 2, Column 2, line two 2. To insert a caption to an image, put the image in a 1 row, 1 column table like this:!filename.jpg! Image caption

Video 1. Adding a video from You Tube, Teacher Tube: a. Find the video you want to use on You Tube. b. On the right side of the video there will be a box with the author of the video and two text boxes one says URL and the other says EMBED. c. You want to copy the text in the URL box. d. In Wiki Mark up mode type the following text: {widget:url= } e. Paste the URL from YouTube after the = like this: {widget:url=http://www.youtube.com/watch?v=qhyr_bqhry0} f. Now the video will be embedded in your Wiki. 2. Adding a video from Vimeo: a. Find the video you want. b. Copy the URL from the top of the web browser. c. Paste it after the = just like the You Tube and Teacher Tube video.