Need help? Check out our Support site, then


need keyboard instruction

  1. vkrecipev1ck13
    Member

    Read your instructions on building a site- they are for sighted mouse users.
    I have problem building my site using only KEYBOARD. NO mouse.
    So I cannot ‘drag & drop’. Can you please provide instruction on doing the following tasks using Keyboard ONLY?
    (Theme: Mini magazine; Images uploaded to Media Library already)

    1- Install image in header

    2- Associate Image in media library with Image Widget.

    3- Re-order links in Category Widget

    4- Transfer a widget from sidebar to ‘Inactive Widget’.

    --------------------
    I am blind and know some basic HTML-CSS. If I can use the ‘text editor’, it should be more user friendly than a ‘visual editor’ but I can’t find the option to switch to that mode.

    Appreciate your help
    VK Cookrih

    The blog I need help with is cookrih.wordpress.com.

  2. We try to make our functionality accessible, but not all features currently are, so I appreciate you taking the time to write in. Let me see if I can assist you with these points.

    Are you aware of the Accessibility Mode for the widget area? You can enable it under Screen Options, and it provides some additional keyboard actions.

    1. You can upload an image using the keyboard, but I'm not sure you can edit the crop box. Let me know if you need assistance with that.
    2. If you know the direct URL of the image (which you can get from the media library under edit) you can enter the URL into the Image Widget via copy/paste.
    3. There isn't a way to reorder categories in the Category widget. If you meant the Links widget, it looks like that may not be not fully accessible. Again, let me know if I can assist you with settings there.
    4. In accessibility mode, it looks like you can delete a widget, but not make it inactive

    I hope this is helpful. I appreciate you pointing out areas where WordPress.com can improve its accessibility.

  3. vkrecipev1ck13
    Member

    thanks Jackie,
    is there a list of keyboard controls in one place i can refer to? can't find it.

    you mentioned 'screen option'. could you give me the path to said option?
    thanks for your response
    vk

  4. To enable "Enable accessibility mode"

    When at

    Dashboard >> Appearance >> Widgets >> Screen Options is a Drop Down section - at the top of the screen on the right side of the screen is the "Screen Options" - click on it and "Enable accessibility mode" is the only option available - at the top of the screen on the left side just to the right of the Sidebar - click on it

  5. vkrecipev1ck13
    Member

    Thank you for your instruction. I have rewritten instruction for ‘keyboard user’. Perhaps you can add it to your tutorial section for other blind keyboard user to reference in future.

    (screenreader users read information in the order a page is coded, not as laid out by CSS. A button on the top right of a page may be on line189 on the HTML coded page. Another button on the left bottom of a page may be on line 20 on the same page. The most user friendly, efficient way for us to navigate a page is by heading levels. In this instance I have to listen to the page line by line to find the info. Below I have written the more efficient way to get to the link by keyboard.)

    Turn on accessibility option:
    • Dashboard >> Appearance >> Widgets >>
    • Press ’L’ to skip from list to list till you jear ‘HELP’. Alternatively, press ‘landmark’ command once to get to ‘NAVIGATION MENU’.
    • Arrow down you will hear ‘screen option – collapsed’
    • Presss ‘ENTER’ to open dropdown menu.
    • click on it and "Enable accessibility mode" is the only option
    • available.

  6. Are you using NVDA perhaps? Just curious. Another thing I do quite often when I know the name of the link I'm looking for is hit insert F7 which will bring up a list of links. Then hit S for screen options.

  7. yes, I am using NVDA. how wonderful to meet another blind member here! could you tell me how to insert an image into a post with text article as well? i had written a post, published it, then decided to insert an image. i used edit post option but could not figure out how to insert image into the post at cursor point despite numerous tries. in one of my tries, i noticed the tag <b> so i thought the post was in 'HTML' mode so i went to media library to copy short code of the image and pasted into the article and publish. but instead of picture, the pasted code appeared so i deleted the post.

    another problem is after i pasted my article in the 'content' box, i cannot tap out of the box. have to use firefox keystroke to go to locationbar, then tap back into the webpage.

    what is your website called? would like to pay a visit to your site.

    thanks.
    vk

  8. Thanks so much for the additional information. I have updated our Widgets support documentation with your instructions: http://en.support.wordpress.com/widgets/

  9. Ah, unfortunately I don't do much with images. It sounds like you're using the visual editor, which as you have discovered, does not work well with screen readers. Switch to the text editor and you won't have the problem with NVDA getting stuck in the edit box. You may also find a hint about inserting images from the buttons on the text editor. Click on my username and you'll be taken to my site. I'm in the process of restructuring it, so it's a bit of a mess right now.

  10. vkrecipev1ck13
    Member

    Hi Bob, I visited your site and left a comment on Microsoft article page. How do I switch to ‘text editor’?

    Hi Jackie,
    If I use ‘text editor’, I should be able to paste the <img src…’ code into the editor, right?
    - Can I add in a bit of code to make the image to float right?

    I typed a caption for the image in the media library. If the caption did not appear with the picture, (which happened to my header image- no alt text although it is in the media library); how do I ensure to caption and image appear together in the webpage?
    If you could not provide keyboard instruction on how to do it, may I put image and caption in a right floating div in the ‘contents’ box? That means I shall write an inline line of code for the div in the article itself to float right. Is that allowed? I checked your allowed code page and div is allowed.

    thanks
    vk

  11. Thanks for leaving that comment. As for switching editors, the easiest thing to do would probably be once you're on the posts page press insert F7 to bring up a list of links, then press V for visual editor, it may just be labeled visual I can't remember. The next link down should be text. Click that and you will notice that a number of buttons have now appeared between the title and body boxes. Now your screen reader won't get stuck in the box and you may even be able to insert the image where you want.

  12. Hi vkrecipev1ck13,

    Yes, you may add any HTML code to your site using the Text editor, including < img > tags and < div > tags.

    The easiest way (usually, anyway) to add a caption is to do so in the Media Library, but navigating the Media Library may be difficult if you are unable to see the contents. Let me know if you have questions about that.

  13. Thanks Jackie,
    I have created a post successfully but am not sure it is done with ‘Visual editor’ or ‘Text editor’. Hope you can enlighten me. Actually I have a sub-heading in the article I’d like to tag as h3 but since I am not sure which editor I am using , I’d check with you first.

    WHAT I DID:
    -After clicking ‘onscreen option’, found ‘text’ and ‘visuals’

    -chose ‘text’ and pasted article in ‘contents’ box. Saved as draft.
    The confusing part is there is no tags for paragraph, lists etc.

    - Chose ‘Visuals’ and option to use photo already uploaded to ‘Media library’. Although the photos I uploaded appeared, clicking on it did not select it. Finally re-upload from PC successfully, added caption and to flush right options. This time, the code <img src…’ appear and tag for caption as well (what one expect in an html document).
    - BUT the original text article below the ‘Visuals’ are not tagged like an HTML document.

    ?? So did I use a text editor or a visual editor?

    If it is a ‘text editor’, can I manually type in <h3> tags to my heading manually or will the tags appear visually in the published article like what happened in my previous deleted attempt?

    Thanks
    VK

  14. If you can see HTML in your post, you are in the Text editor. If you can't, or if you type HTML code and it displays improperly on the actual post, then you are in the Visual editor.

    Looking at your post, it appears you were indeed in the Text editor as everything appears correct.

    You can use pretty much any HTML tag you wish in the Text editor including tags for paragraph, headings and lists. We have a drop-drop menu option and buttons to help with HTML formatting, but those are simply shortcuts, not essential for composing a new post.

  15. vkrecipev1ck13
    Member

    hi Jackie,
    i created the 'about this blog' over the 'about' page but this time couldn't add any photo. direct upload didn't work and when i tried writing my own code, it didn't work either. i have deleted previous photo and uploaded a new one called 'food.jpg' but didn't work either.

    is this the proper way to code it?

    <img src="
    http://cookrih.files.wordpress.com/2014/02/food.jpg" width="278" height="186"
    alt="Plate of food" />

    if not, can you please upload the 'food.jpg' photo for me, which is in media library?
    i can't re-edit the page despite numerous tries, the wrong page keep getting saved- don't know why.

    thanks
    vk

  16. If you go to the page at https://cookrih.wordpress.com/wp-admin/post.php?post=25&action=edit which is the page you get to if you select the image in the Media Library and click "edit". On that page there is a box that displays the File URL in a selectable format.

    That file URL is: http://cookrih.files.wordpress.com/2014/02/food.jpg

    So if you go to your about page, for your IMG link, instead of the link you have, which is:

    http://cookrih.wordpress.com/about/plateoffood/#main

    you use the file URL http://cookrih.files.wordpress.com/2014/02/food.jpg within the IMG tag, it should work.

  17. hi jackie,
    in last sentence of my previous post, i said i could NOT re-edit the older deleted plateOf Food.jpg to the newer food.jpg. Each time i change it to food.jpg, could not update it to newer photo. anyway, have figured how to do it now. thank you.

    here are my last questions then let's close this thread:
    1- how can I change my admin email? any link you can point me to ?

    2- can you ask your developer team to LABEL the following:
    TEXT EDITOR, CONTENT EDIT BOX.
    when i used my screenreader to compile all links, they were not shown with appropriate names ie. 'text' and 'content'. were missing. the 'visuals' was displayed as 'visuals' in the link list but not 'text'. or 'content'.

    3- i want to create a table and know how to code it.
    my question: can i specify width of table and columns and lines/border thickness for each cell and
    alignment of words eg centered or flush left text?

    width, alignment and thickness of lines are CSS but essential when building a table to make it easy to read. will all those attributes be stripped out automatically?

    without those attributes, the table will be difficult and confusing to read.
    thanks
    VK

  18. Sorry I missed the issue with the editing. I'm glad you were able to resolve that! :)

    To reply to your questions:

    1. You can update your admin email here: https://wordpress.com/settings/account/

    2. I will let our developers know about the labels.

    3. If you are creating an HTML table, you can specify all of that formatting purely within your HTML code. Outside of tables, you can do some very basic formatting within the Text editor, but for more precise control, you would probably want to modify the actual site CSS, for which you would need the Custom Design upgrade.

    http://en.support.wordpress.com/custom-design/

  19. Also, please don't feel like you have to wrap up this thread. I'm happy to keep helping you find your way around WordPress.com settings and processes, so let me know if you run into any other issues.

  20. vkrecipev1ck13
    Member

    thank you Jackie. you are really nice and helpful
    cheers
    VK

  21. @vkrecipev1ck13 I have a follow up question for you.

    When you're composing your posts, are you using the standard post editor window from the Dashboard (e.g. https://cookrih.wordpress.com/wp-admin/post-new.php) , or are you composing from the quickpost drop-down menu (e.g. http://wordpress.com/post/) ?

  22. vkrecipev1ck13
    Member

    the last few times i used dashboard. i find dashboard more preferable and will use it in future.
    thanks
    vk

  23. Thanks for letting me know.

  24. vkrecipev1ck13
    Member

    Hi Jackie,
    The WP tutorial on aligning photo is not helpful because NO Instruction on how to do it with a keyboard was given.
    I want to insert some photos in specific places in my article and align them left.

    I am using dashboard to place photos already uploaded into media library.

    After placing cursor in desired place, I tapped out of edit box and chose ‘IMG’ Button. The dialog box that appeared only allow for ‘photo path’ and ‘label description’ . no choises for alignment. After clicking ‘OK’, I was returned to edit page but couldn’t find option to align photo.

    How do I align photo using keyboard?
    Where is the ‘Alignment’ dialog box?
    My draft page:
    http://cookrih.wordpress.com/moisturize-for-lovelier-skin/

    thank you
    VK

  25. I'm not sure if the alignment option is available via keyboard. My best recommendation is to modify the IMG HTML code that is inserted into your post:

    class="alignnone

    You can replace 'none' with 'left', 'center', or 'right' in the code you can view in your text editor.

    Because many of these issues are common to both WordPress.com and the version of WordPress that can be downloaded at WordPress.org, you might find interesting is the WordPress Accessibility initiative, http://make.wordpress.org/accessibility/ . A group of people work to improve all elements of WordPress accessibility, and since it is a community initiative, we would welcome your involvement as well.

  26. vkrecipev1ck13
    Member

    thanks Jackie,
    can you please provide a more full code ?
    for image path of file, just XXXXX to represent that will do but i am not sure about how to write the alignment bit.

    will follow your suggestion to visit the accessibility page.

    thank you
    vk

  27. In your existing post at http://cookrih.wordpress.com/2014/02/11/a-perk-me-up-drink-2/ you have the following code:

    [caption id="attachment_16" align="alignright" width="276"]

    You could modify it to be align="alignleft" or align="aligncenter" or align="alignnone" to change the image alignment.

    Note that this is an image with a caption; if it doesn't have a caption you will still have the align code but it will be phrased slightly differently.

  28. vkrecipev1ck13
    Member

    thanks Jackie,
    i have succeeded in aligning the photo and found a website that provided useful tips for using wordpress. hope i won't need to trouble you again
    cheers
    VK

  29. You're very welcome. Please feel free to let me know if you run into any further issues.

  30. vkrecipev1ck13
    Member

    Dear Jackie,
    How do I code for picture to appear in the webpage?

    For more than a week I had tried various ways to place another photo into
    http://cookrih.wordpress.com/moisturize-for-lovelier-skin/
    All failed. I don’t know why the media library did not provide the path to the image file like previous images.

    The links currently are:
    http://cookrih.wordpress.com/?attachment_id=50
    And the short link: http://wp.me/a4jCgc-O

    I tried using as per above as well as put within <img src tags. No picture appeared, only a clickable link to the image file.

    0-------------
    WHAT I DID:
    The current photo “congeeMaker”: I opened page in text editor mode and uploaded photo from my PC to the page.
    Then went to image library to get image file path but only obtained as shown above.

    Previously I tried the method used for other photos by uploading to image library, then to obtain path but result was same as current one: http://cookrih.wordpress.com/?attachment_id=45
    I deleted that photo and short link.

Topic Closed

This topic has been closed to new replies.

About this Topic