Tech Support: Project 1


Wordpress Support site (search-able)


Project 1





  • Citing Sources in Project Pages

    •  

    • Name authors/sources in text, and provide source information (bibliographic detail) in Comment.
      See example.

      — Note: fine to just cite source of media in Comment (rather than explicitly identifying in the page), including images, audio, video clips; be sure to identify any media presented, and feel free to link to the source (in the comment).











  • Formatting Images

    • — this is the “Edit Image” icon, referenced below. Click this to
      edit the Size, Alignment, and Hyperlink of an image that is already on your page.

 
 

  • Creating Image Link (two ways):
     

    • At time when you insert Image into Posts/Pages (using the “Insert Media” command):in the text field next to Link Image To:”

      type/paste the URL of the page you’d like Image to send browser.

        For example, adding
        “http://garyhink.net/course/S10/tech-support/project-1/”
        to an image will link to this page.
        (remember to use the “Permalink” URL, rather than something like
        “//project-1/” or “http://garyhink.net/course/S10/wp-admin/page.php?action=edit&post=705″)


    • Or, if the image is already on your page:
       

      • (in Visual edit) Click on the image once, then the “Edit Image” icon…— in the Edit Image dialog box, add the link address in the text field for “Link URL.”

      • (in HTML edit) Find the ‘‘ tag on the page;— Place hyperlink tags around the IMG (no text necessary):
          ‘(a href=“http://garyhink.net….”) (/a)‘


  • Change Image Size (two ways):
     

    • At time when you insert Image into Posts/Pages (using the “Insert Media” command):
      select “Size” at the bottom of the dialog box (Thumbnail, Medium, Large).
      This does not change the actual size, just the display; by default, images might be quite large…(I do not recommend “full size”)
      Tip: Thumbnail size is great for image links!

  • Note that at this time (in dialog box of “Add Media…”),
    you can also select the Alignment —
    the image position on the page (Left, Center, Right).

    •  
     

    • Once an image is already been “embedded” (e.g. Edit Page step):
       
      — in Visual editor view:
      click and drag one corner of the image to re-size visually.

      — or, open Edit Image command (Edit Image icon) and select %.

      — or, in HTML view (recommended):

        change the size of the image by editing its code
        from ‘< img src=”…..” >’
        to ‘< img src=…” height=75% width=75% >’
        (without quotes or spaces between brackets)
        —— The H/W percentage can be adjusted from 1% to n % (i.e. 200% doubles the dimensions).

      For example (26% & 37% dimensions):

     



    » Note: Images will only display side-by-side if there is sufficient width of the page;
    this can be accomplished adjusting the dimension % of each image
    (restrictions due to blog theme/template).

    Suggested: best method for horizontal display of multiple images (in a row) is to
    create a table,
    and put each image into a cell of the row.
    (See below.)






  • Image Editing
    • Guideline for project:
      image shows some evidence/extent of “manipulation”
      (i.e. other than original appearance);
      remember to save & upload the new image file.
      Note: remember to Save As .jpg (in Pixlr) — this is not the default File/Save format.
      Suggestion: use the WP Media Library to “Add New” by uploading (allows multiple uploads).
      If the image does not appear, the file format is not supported/correct.
      (Usually solved by renaming on your computer,
      e.g. changing “Untitled” to “Untitled.jpg” and then re-uploading.)






  • HTML editing
     

    • Special Characters (Webmonkey) — note: use the “Name Code” in HTML view.

      •  
       

    • Add a hyperlink to any text or image:
        ‘< a href=”….”>Text < /a >’ (no space between brackets and ‘a’; no single quotes).

      •  
       

    • Create link to send browser to points on page:
      HTML Links Instructions

        They don’t specify the sequence, which is key:

      • First, create the “anchor,” point where you’d like the browser to go on the page. (in HTML view)
        This is the ‘(a name=”anchor”)’ tag . Don’t forget the ‘(/a)’ afterward; you can use any single word for the “anchor.”
      • Then, create the link like normal; instead of the URL (“http://”), put “#anchor” name (inside of quotes). (a href=”#anchor”)So, (a href=”#anchor”)This text becomes a link.(/a)
        → sends browser to
        (a name=”anchor”)This point on the page.(/a)

      •  
       

    • Create a Horizontal Line:
        Type ‘< HR >’ (without spaces or quotes)

      •  
       

    • Page Alignment:
      • To center: ‘< center >’ (w/out spaces/quotes);
        don’t forget to “turn off”! using ‘‘
      • Right align: ‘< p align=right >’ & ‘< /p>’
        (w/out spaces/quotes)

      •  
       

    • Creating Tables — Webmonkey Basics; Formatting


      • Instructions for making Table of images: Text Document (.txt)


Comments are closed.

Trackback URL for this entry