I'm trying to do multi-column articles in the Joomla Editor using TinyMCE. I was doing it step by step with this tutorial: https://coolcat-creations.com/en/blog/multi-column-editing-for-joomla-authors
Everything was fine till the styling part. It looks like whatever I do in styles it does nothing. I tried multiple locations for the editor.css file, I tried changing custom css link in Joomla. Nothing really helps, I'm stuck. Does anyone has that problem? I was searching for the solutnion but none of them helped...
Will be really glad if someone will direct me to the solution!
My JS:
tinymce.init({
selector: "textarea",
plugins: [
"advlist autolink lists link image charmap print preview anchor",
"searchreplace visualblocks code fullscreen",
"insertdatetime media table contextmenu paste "
],
toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image"
});
Related
I'm currently trying to find this tab and click on it. I'm trying to find a easier way of clicking on this button. In my code, I tried to use find command and it's unable to find this tab.
<div role="tab" aria-disabled="false" aria-selected="true" class="ant-tabs-tab-active ant-tabs-tab">Animals</div>
Code:
find('tab[div=Animals]').click
Not sure what I'm doing wrong.
It looks like you need to study CSS selectors a bit more. 'Animals' is text content and CSS does not provide a way to query on text content. In Capybara you can use the text option to filter matching nodes by their text content so combining valid CSS with the text filter like
find('div[role="tab"]', text: 'Animals').click
or
find('div.ant-tabs-tab', text: 'Animals').click
would be ways of clicking on that element
Note: I would recommend https://flukeout.github.io/ to learn what you can and can't do with CSS selectors.
my tumblr theme hides the tags in a post when you don't click the post. is there a way to make the tags appear all the time?
.
I've tried writing
{block:HasTags}
<ul class="tags">
{block:Tags}<li>{Tag}</li>{/block:Tags}
</ul>
{/block:HasTags}
inside {block: Posts} and even after it, but it doesn't work. here's a link to the html code of my theme: pastebin.com/awQUSraA
It seems tags are hidden on the index page:
.tags {
margin-top:5px;
font-style:italic;
{block:indexpage}display:none;{/block:indexpage}
}
Remove {block:indexpage}display:none;{/block:indexpage} and they should be visible.
I am making a blogging application in laravel 5. I am using tinymce for writing post. My application is working for adding new post. But when I am updating posts(which contains html and java script code), then tinymce is not striping html and java script tags.
For example, my post is:
<script>alert("hello");</script>
<h3>heading 3 </h3>
italic text for test
bold and italic for test
Note:
My third line is italic and fourth line is italic and bold. I don't know how to decorate text here on stackoverflow.
Above written code should be stripped and should display as it is.
It is displaying well in browser. When I try to edit this post then I get in tinymce editor
heading 3
italic text for test
bold and italic for test
I want to strip these tags in tinymce editor.
UPDATE:
I am using tinymce by adding this code
<script type="text/javascript" src="{{ asset('/js/tinymce/tinymce.min.js') }}"></script>
<script type="text/javascript">
tinymce.init({
selector : "textarea",
plugins : ["advlist autolink lists link image charmap print preview anchor", "searchreplace visualblocks code fullscreen", "insertdatetime media table contextmenu paste"],
toolbar : "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image"
});
</script>
If you still can not understand the question. I embed code in by blog post in tinyMCE which is stripped in browser. When I edit the post then code is not stripped in tinyMCE.
Live demo of this problem is at sweet-blog.herokuapp.com
This is my image syntax...
[{{ :image-link.png?200|This is the caption.}}]
Which adds the image, right aligned.
Your help is greatly appreciated... Thank You!
The DokuWiki syntax you quote shows you are using the Image box plugin - which allows a caption, but produces a blank alt tag.
e.g. [{{ :software:contao:contao_install_open_sauce_00.png |Layout -> Themes -> Themes Import}}]
renders the HTML:- <div class="thumb2 tcenter" style="width:100%"><div class="thumbinner"><img exify_intitialized="true" src="/business/lib/exe/fetch.php?media=software:contao:contao_install_open_sauce_00.png" class="mediabox2" alt=""><div class="thumbcaption"><strong>Layout </strong>→<strong> Themes </strong>→<strong> Themes Import</strong></div></div></div>
and creates an boxed image with a caption (Wikipedia style) and an empty alt tag.
So you can not populate an alt field using the Imagebox plugin, but you can populate an alt field using the [built-in image tag] [3]. The alt tag generated by the built-in image tag is populated by the value you give to the (tooltip) "caption".
e.g. {{ wiki:dokuwiki-128.png |This is the caption}} (see :wiki:syntax#media_files)
renders the HTML <img exify_intitialized="true" src="/_media/wiki:dokuwiki-128.png" class="mediacenter" title="This is the caption" alt="This is the caption">
If you want to use both a title tag (tooltip) and a different alt tag you need to enable HTML in your DokuWiki and add the image using HTML.
What you did should already succeed in providing the image with an alt text (not with a caption!), except that you don't need the external square brakets:
{{ :image-link.png?200|This is the alt-text.}}
If you want a caption instead, you should look at some plugin such as the box plugin.
Finally, if you wanted a link consisting in an image with an alt-text, just use something like
[[www.theaddress.it|{{ :image-link.png?200|This is the alt-text.}}]]
I am currently migrating my swf 10 OL 5.0 code to DHTML runtime and i am facing this problem.
I am not able to set a custom cursor for a view that i am dragging. Then i found that the code that is given in the documentation is also not working. The following code is running fine in swf 10 runtime but its not working in DHTML runtime.
I have attached the sample code
<canvas height="30">
<resource name="waitcursor" src="wait.png"/>
<view bgcolor="yellow" cursor="waitcursor">
<text>Roll over to change the cursor</text>
<handler name="onmouseover">
lz.Cursor.showHandCursor(false);
</handler>
</view>
</canvas>
I am able to see only a normal cursor.
I tried changing the cursor through javascript but also didn't work. I figured out that the sprite event class is managing this and its not possible to work it out with javascript.
I am currently testing this in 5.0 version and using Firefox 16.0 Windows.
You are using the wrong name for the resource. When manipulating the mouse cursor in DHTML, the name of the resource is directly used as a value for the CSS property cursor.
This code works as expected:
<canvas height="500">
<!-- The name attribute used here is directly set as a CSS property
cursor: {value of name property}. -->
<resource name="wait" src="cursor_wait.png"/>
<view bgcolor="yellow" cursor="wait">
<text>Roll over to change the cursor</text>
<handler name="onmouseover">
lz.Cursor.showHandCursor(false);
</handler>
</view>
</canvas>
Have a look at the W3C Wiki documenting the CSS property cursor and the allowed values. The allowed values are:
[ [ ,]* [ auto | crosshair | default | pointer | move | e-resize
| ne-resize | nw-resize | n-resize | se-resize | sw-resize | s-resize
| w-resize | text | wait | help | progress ] ] | inherit
Your code sets the cursor value to cursor: waitcursor, and the browser cannot recognize that value. This limitation is mentioned in the developer guide as well, Chapter 31: Input devices and gestures:
With OpenLaszlo 4, you can set custom cursors in DHTML and SWF. If you
plan to use custom cursors across DHTML and SWF, be sure you're using
appropriate cursor IDs for DHTML (see
http://www.quirksmode.org/css/cursor.html for more info), and make
sure you've included resources named after those IDs for SWF.