There are blocks in drupal like Main Menu, Navigation, Management Etc,
They all appear as a solid text in huge letters, but I want to turn them into links and to act as an actual menu.
Is there any extension that does it, or I would have to code it my self?
I'm a newbie in drupal but I don't want to re-invent the wheels, if it's already provided somewhere.
Edit:
Well, the titles of the block are the solid text indeed, I want to turn them into link, or at least hide them, these letters are so huge and out of place. And if I set label to '' it displays the default word, like 'Navigation'...
Enter <none> as the title to hide the block title. Blocks are not made to be pages so there's no point linking to them. Consider a view if you want more complex functions from blocks.
Related
After having been given the task of translating a whole "document" from german to english, I am really glad that WPML's Translation Editor makes it so easy to keep the structure intact and only change the actual text inside it.
That said, I've been running into an issue when the text comes from an Elementor Text Editor and contains links: WPML's Editor doesn't seem to offer a way to also translate a link's destination. It provides a way to mark where the text of a link is in the translation, but that's it.
And some links are language coded, like &lang=de, but since the Editor only translates the text of the link, the result then points at the wrong destination.
E.g. the english section of a text pointing to a source in german.
This is something I keep having to fix manually afterwards, because the Editor only offers translating destinations for Elementor widgets that declare the fields translateable, and even there it can be spotty, as I've found out.
Now I am wondering if there's something I could do to configure WPML to take those links inside the Text Editor element like it does with actual link elements, or if that's out of the question.
I'd really prefer to not have to routinely check the translation destinations, because as it stands do I not even know when WPML triggered an automatic translation because something about the layout changed, but no text changes happened.
So the changes to the link destinations could be just undone silently, which has happened before for a different part of the site.
I have an issue with the Gutenberg blocks in WordPress. I save a section of text with an image as a reusable block. However, if I insert that block multiple times on the page and change one image, all of the images are changing.
I can't seem to find any workaround for this. I want to be able to change each image individually. I even tried using "Design Patterns" however the results are the same.
Is there any solution to this?
You will need to convert the reusable block to regular blocks before you can update the images individually. There is a button in the toolbar when you select the block that allows you to do this:
Above you se a typical breadcrumb.
Sometimes there are to many steps in that breadcrumb, so we have to shorten it by replacing some of the steps in the middle and display three dots instead
When a user clicks on the three dots, the entire breadcrumb is visible.
How would you handle the accessibility issues here?
We would like to show all the steps to our screen reader users so those users can tab trough the entire breadcrumb whiteout ever knowing about those dots.
All other users will only be able to see those tree dots.
We can accomplish this in a few ways:
Use display:none but this will hide the hidden content for all users, including screen readers
We can use the class.sr-only (since we're using Bootstrap) or something similar on those hidden links so only users with screen readers will se the hidden parts of the breadcrumb. This will work, but it will remove the hidden parts breadcrumbs from the tab order.
We can stick to #2 above and add taborder="0" to those hidden links in the breadcrumb, but then we also have to add taborder="0" to every single interaktive element on the entire site and that is NOT an option. :-)
Are there any other ways to include the hidden links in the tab order?
(Sure, one can discuss the UX aspect of abbreviating a breadcrumb, but that's perhaps another topic.)
(Sure, one can discuss the UX aspect of abbreviating a breadcrumb another topic.)
This is perfectly the topic.
Blind person are normal people who like simple things. If you think your breadcrumb is too long, give them the same functionalities :
<button aria-label="view full breadcrumb">...</button>
Breadcrumbs have not been invented for blind people. They are part of one technique in a WCAG AAA guideline which implies that : it's not mandatory, and that it concerns everybody.
If you include hidden links in the tab and speech order, you are sure that your website won't be accessible.
A near-blind person using a screenreader in support of his eyes won't be able to view a link on the screen while it's announced by the screenreader.
A person using a keyboard only system will focus an invisible link which will remove the predictability of the focus order.
Note that for 2/ and 3/ the sr-only does not remove the elements from the tabindex, so this will work as you would expect
I'm currently building a web form using APEX that is losely modelled after a "wizard" style. That is, I have forward and back buttons for most pages, etc, etc.
The problem I have is that it seems all my buttons need to be part of a region and that region needs to located in a pre-determined section of the page.
I would prefer to be able to place my buttons where I want them rather than include them into a specific region. I just want them at the bottom of the page.
At the very least, I need to get a region to ignore all my theming so that it can be "invisible" so that only the buttons are showing.
Can anyone point me in the right direction?
See this example I just created on apex.oracle.com. The buttons are in a separate region that has no template associated with it.
In fact, it would be better to create a new region template for the buttons region, with no decoration applied. This would give you more control over the location and spacing of the buttons. At its simplest this template could be defined as:
<div id="#REGION_STATIC_ID#" class="myButtonTemplate">
#BODY#
</div>
(The ID is optional, but I like all my tags to have IDs so I can reference them in Javascript and CSS if required.)
I am developing a public website which is the front end to information about medical conditions.
After the user does a search (questionnaire based) they are presented with the results which are categorised in to sections and sub-sections.
Information items can be assigned to both sections and sub-sections.
At the moment sections are represented by tabs across the top and the screen and sub-sections by links in a sidebar. The links in the sidebar change depending on which section is selected.
The problem is the section names are quite long (several words) and as a result the combined length of the tabs is too wide for a standard screen resolution (1024 x 768). Therefore they wrap and break the page layout. We will also have to add additional tabs in the future.
With this problem in mind and the fact our target audience is quite wide, this is a public medical website, what options are there for presenting this kind of information in a way which is accessible and easy to navigate for an average user.
How long are the subsection names? Will they fit in the space for tabs? You’re likely to get better user performance if you put the section links on the side bar menu and the subsection links in the tabs, rather than the other way around. See http://www.usability.gov/pubs/040106news.html.
The other alternative is to put everything on the side bar menu. Subsection links can appear indented under their section links. You can also consider putting the subsection links in a column of their own to the right of the section column. This makes the section menu stable, but takes a lot of horizontal space that’s perhaps better used for content. In either case, proper attention to visual design will show the current section, subsection, and the link between them.
There shouldn’t be a problem with accessibility as long as you’re using links to navigate to each section/subsection (perhaps generated programmatically for each page based on a database relating links to pages).
Just brainstorming some ideas:
Use combo boxes to allow the user to select the (sub)sections, then display the appropriate information items.
Create separate pages for each section-level and provide a bread-crumb control to show the user where he / she is in the page hierarchy.
Create some sort of fold-out menus that automatically hide when the user reads an information item.
In another question on SO, I came across a link to Quince, perhaps you can find some inspiration there as well.
You could try:
An iPod-style menu (in which subsections are hidden pages that fly in from the right): http://www.filamentgroup.com/lab/jquery_ipod_style_and_flyout_menus/
Or as Daan has said:
Cascading drop-down boxes: http://www.asp.net/AJAX/AjaxControlToolkit/Samples/CascadingDropDown/CascadingDropDown.aspx
The downside with both of these (over a traditional tree view) is that the subsections aren't visible until you choose a section. If your users don't know the name of the subsection they're after, then either of these will be a good fit.
If, on the other hand, they do know the name of the subsection they're after, it's probably better to give them an auto-complete textbox so they can type a few characters and go directly to it.