You know Microsoft's templates for Word, like the CV templates or formal letter templates etc. Those templates have dummy text like "You can edit this section bla bla..."
I'm designing a template for my friends to use. I want to add a paragraph that can be edited with a single click. How can I do that?
This is what I'm trying to say (gif): https://s8.gifyu.com/images/gif37fd08f069cff363.gif
I've tried using "MacroButton noname [Text]" but it doesn't allow using text longer than 1 line.
Microsoft templates use Content Controls (on the Developer tab). Using either a Rich Text or Plain Text CC, open the Properties dialog and set the Show as dropdown to None and check the option beside Remove content control when contents are edited.
Now the tricky part: making the entire paragraph selected when you click on it. You can't set this with the Properties dialog. Instead you have to edit the XML, adding the line with the comment beside it:
<w:sdt>
<w:sdtPr>
<w:id w:val="1781998595"/>
<w:placeholder>
<w:docPart w:val="A97E97C2665C45749484CCB99C007209"/>
</w:placeholder>
<w:temporary/>
<w:showingPlcHdr/><!--Add this line to the XML to make text get selected with single click-->
<w15:appearance w15:val="hidden"/>
</w:sdtPr>
<w:sdtContent>
<w:p w14:paraId="5C4F7F28" w14:textId="240370F5" w:rsidR="005B3871" w:rsidRDefault="005B3871" w:rsidP="005B3871">
<w:r>
<w:t>Video provides a powerful way to help you prove your point. When you click Online Video, you can paste in the embed code for the video you want to add. You can also type a keyword to search online for the video that best fits your document.</w:t>
</w:r>
</w:p>
</w:sdtContent>
</w:sdt>
Here's my introduction to editing OOXML: OOXML Hacking: An Introduction
Related
I have a MS-Word template where the user sometimes will have to edit content controls.
Therefore I would like to force the developer tab to be visible whenever a document based on this template is opened.
I changed the CustomUI:
<customUI xmlns="http://schemas.microsoft.com/office/2009/07/customui">
<ribbon>
<tabs>
<tab idMso="TabDeveloper" visible="true" />
</tabs>
</ribbon>
</customUI>
No error is thrown when the document is opened - but the Developer tab isn't visible.
Any thing else I have to consider, to force the tab to be visible?
(Vice versa works: hiding a visible Developer-Tab by setting visible to false)
(There is no VBA attached to the document.)
OK - sometimes a short break helps:
I am adding a custom tab containing the relevant buttons from the developer tab. Plus: renaming them :-)
<customUI xmlns="http://schemas.microsoft.com/office/2009/07/customui">
<ribbon>
<tabs>
<tab id="Abnahme" label="Abnahmedokument">
<group id="x" label="Eingabefelder">
<button idMso="ContentControlText" label="neues Eingabefeld" size="large"/>
<button idMso="ControlProperties" label="Eingabefeld bearbeiten" size="large"/>
</group>
</tab>
</tabs>
</ribbon>
</customUI>
I know of no method other than user education.
You could, in your distribution template, add your own duplicate tab or a tab that has the controls for Content Controls. Better practice is probably to put the Content Control tools on your own additional tab and ignore the Developer Tab.
See also Hide/Show all tabs on Ribbon except Custom tabs which also says there is no method available via VBA.
The following caveat is for someone finding your question in a web search and thinking about using the Word.OfficeUI file and finding this question in a web search. It does not appear that you are doing that.
For customization distribution, the UI editor in Word is a very poor tool. It is intended for personal use.
The Word.OfficeUI file produced by Word will overwrite any user customizations including QAT customizations. Placing that on a user's computer is mean and dictatorial just like overwriting the Normal template. It is a bad practice.
For distribution, you should be editing the XML of a global template. Likewise, such a template is the best method of distributing other user interface customizations like macros and building blocks. The methods for doing this are explored in the book RibbonX: Customizing the Ribbon User Interface and on Greg Maxey's page: Customize the Office Ribbon: It doesn't take rocket science.
I'd like to use the TinyMCE editor to write text that includes Mustache template variables, specifically to include repeating groups. I'm willing to use the html code view within TinyMCE if I have to (this is definitely a rarer use case).
I can do it just fine with an ordered list. That is, in the code view I can write
<p>Blah blah blah</p>
<ol>
{{#info.courses}}
<li>{{course}} -- {{course_title}}</li>
{{/info.courses}}
</ol>
<p>All done!</p>
and I get a nice ordered list of all the courses and titles.
However, if I try the same thing with a table (replace <ol> with <table>, etc) TinyMCE rearranges the code when I exit the HTML code view. It removes the repetition tags and places both in a paragraph before the table.
Any way to get TinyMCE to leave my changes to the HTML alone?
I realize it is asking a lot to change the representation of what TinyMCE is working on, but thought I'd ask.
Alternatively, any suggestions on other approaches to include Mustache tags in the contents of the editor?
I'm currently using version 4.9.4.
I am working on making one of the AEM website of my client accessible. For the same, I want "aria-label" attribute should be added(value can be provided in authoring dialogue) to the anchor tag, when the target selected is "New tab".
Could not find much around it, following link describes we can customize the rtePlugin/linkPicker. But could not figure out my problem. Any help/guidance
http://experience-aem.blogspot.com/2017/06/aem-63-touch-ui-rte-rich-text-editor-color-picker-plugin-inplace-dialog-edit.html
Option 1) Reuse Alt Text/title from otb anchor link. No need to customize dialog. When Alt Text is authored otb will populate title like this <a title="Google" href="htttps://www.google.com">Google Link</a>
,
You will then need to Write a Link Transformer to copy title into aria-label. The rewriter will look for anchor tags; if title is present, copy into a new attribute aria-label and rewrite the anchor. If link rewriter is difficult, you can also rewrite the rte text from a sling model while saving the RTE text. Use a Jsoup parser to parse HTML, rewrite by copying title to aria-label and write back into JCR.
Option 2) Adding new text box for aria-label to dialog. You can refer to this blog post. But this option is needed only when Alt text is different from aria-label which I wonder why. Usually aria-label and titles are same and option 1 above will suffice.
So Finally was able to add aria-label attribute with some troubleshooting. Moreover the steps in the links mentioned above are same. Want to add additional details which I faced issue with
Adding new field
Follow the steps mentioned in the blog
After adding the field as mentioned in the blog the newly added attribute will get filtered by AEM. You will see the following error in error.log file
Error : "26.09.2017 12:40:42.804 INFO [0:0:0:0:0:0:0:1 [1506447642680] GET /content/we-retail/language-masters/en.html HTTP/1.1] org.apache.sling.xss.impl.HtmlToHtmlContentContext AntiSamy warning: The a tag contained an attribute that we could not process. The rel attribute had a value of "bookmark". This value could not be accepted for security reasons. We have chosen to remove this attribute from the tag and leave everything else in place so that we could process the input."
Solution: Declare the attribute in the AntiSamy configuration file in CRXDE Light.
Note : make the following changes in /apps/cq/xssprotection/config.xml (overlaying /libs/cq/xssprotection/config.xml), for Sightly/HTL its /libs/sling/xss/config.xml
Copy /libs/cq/xssprotection/config.xml to /apps/cq/xssprotection/config.xml.
Open /apps/cq/xssprotection/config.xml.
In the common-attributes section, add the following target attribute declaration.
<attribute name="aria-label>
<regexp-list>
<regexp value="[a-zA-Z0-9-_\$]+" />
</regexp-list>
</attribute>
Find the tag declaration by searching the term <tag name="a".
Add the line below in the list of attributes:
<attribute name="aria-label" />
Save the file. Now, the link will open in a new window if the option is selected.
Is there anything in markdown syntax specifically on GitHub to support hidden text?
I just want to put some to-do notes in README.md for myself, not to be visible.
EXTRAS
As a tribute to the great answer by Tamas, and what's also asked a lot of times, below is an example of how to write foldable sections within MD files:
<details>
<summary><b>My section header in bold</b></summary>
Any folded content here. It requires an empty line just above it.
</details>
Just use standard HTML comments:
<!-- This is commented out. -->
(This DOESN'T work on GitHub, which strips out CSS. But it can work in other Markdown viewers/editors. The reason I am adding it is because this question came up first when Googling hidden field markdown).
You can hide the field using CSS, if the rendering process respects it and doesn't strip it out:
Is this worth the hassle, as opposed to using an HTML comment? Probably not in most cases, though it does allow toggling visibility on and off.
#### hidden field with metadata 👇
<div class="meta_for_parser tablespecs" style="visibility:hidden">{"dataname":"environment","colvar":"varname","colval":"value"}</div>
#### hidden field with metadata 👆
glow a Rust-based terminal viewer
Typora, on macos
Macdown, on macos
But not GitHub
I'd like to create a custom drag and drop template so I can increase the design possibilities without losing the functionality. I can't find anything in their documentation.
I was hoping to create something like this, not sure if I'm missing something obvious but I can't find a drag and drop that allows for the different coloured background with columns too.
I could use a block of code but I can't edit the css styles so it wouldn't be responsive for mobile and also not very friendly for those who don't know html.
Rather old question, but to who it might be helpfull:
If you code your own template and upload it to Mailchimp you lose the 'drag & drop' system/UX interface with the different blocks. You are able to create repeatable blocks but then it works with a dropdown list. This is (in my humble opinion) not that user friendly and takes a while before you fully understand how to use the dropdown. I had to explain it to a client earlier today and took a while before they understood it, so I decided to write them a manual for it.
But the design you want to create should be possible to make with a standard MC template. In the 'design' tab you will find settings to control background colors etc.
Still not possible, answer from the Mailchimp support: "At the moment, it's not currently possible to code a drag and drop template completely--one of our drag and drop template layouts will need to be selected, but you can drop in Code blocks to get a little more control over the styling of certain sections."
Though, if it's any help, it is possible to fully custom code your own template, and then add in mailchimps special Template language to the template to open up sections as editable within the campaign builder--or even duplicate certain sections of content. It's not quite the same as the drag drop templates, but adds similar functionality. More info on working with template language can be found here: https://mailchimp.com/help/getting-started-with-mailchimps-template-language/
I know this is an old question, but while searching for this myself I stumbled upon a solution posted here.
Basically it is possible to code your own drag n' drop template, but the solution has not been documented.
Find one of the Mailchimp templates (either one of the basic templates or a custom template from the 'Themes' menu.
Use 'Inspect element' and copy the source code of the iFramed html-email.
Paste in your preferred HTML-editor and modify as intended
Create your own template from the 'Paste in code' mode
If you want custom modules to be added by default, edit using the menu 'Edit design' in the bottom of the screen.
Save and exit :)
I found part of the answer on another topic: [Is it possible to code drag&drop templates for mailchimp?
If you add the following code into your main content div or td it will enable the drag and drop block editor:
mc:container="body_container" mccontainer="body_container"
example:
<div mc:container="body_container" mccontainer="body_container"></div>
This code will add a block editor region to the preheader section:
mc:container="preheader_container" mccontainer="preheader_container"
For the header:
mc:container="header_container" mccontainer="header_container"
For the footer:
mc:container="footer_container" mccontainer="footer_container"
Note: It doesn't seem to matter what you call the mc:container. Creating a new container with a different name worked. Although using just mc:container tag seems to work at first by itself, the mccontainer (no colon) tag is required for it to save properly.
You can create your own drag and drop template you need to add the following into your html coded template where you want the 'drag and drop' feature to exist.
<div id="templateBody" mc:container="container_name" mccontainer="container_name" class="tpl-container">
<div mc:block="3502204" mc:blocktype="text" mcblock="3502204" mcblocktype="text" class="tpl-block"></div>
</div>
This can be repeated in your code multiple times for multiple insertions. I could not find documentation to indicate if the container name or block number needs to be unique, I did make it unique in my template.