I have a problem regarding Wordpress/tinyMCE.
Wordpress is 4.5.2 version, and is managed by hosting, so I can not edit tinyMCE files or replace it with different version but default one.
The problem appears in front end only, while it workt normally in admin part of the WP.
When I click on "insert link" button in the toolbar, no dialog appears, and selected text gets the "a" tag, with href pointing to "_wp_link_placeholder".
TinyMCE is initialized using wp_editor() function from the PHP code.
Thanks in advance!
Related
I am using the Froala editor in my solution to create html that is to be sent to a PDF writer. The PDF writer does not support clickable links. This means that the full url must show as text.
So what I want is to disable the possibility to add links with custom text in the editor. I want it to be generated as a clickable anchor link (url) but I want the full url to show in the text. Reason I want this to be inserted as link rather than disabling the link plugin altogether, is that it will then be visually formatted as a link by css.
I have found the setting linkText: false for the Froala editor, which hides the text field inside the insert link popup. This is basically what I want - so far so good.
The issue is that the user can "work around" this by selecting a text in the editor before clicking the link button. The text is still not shown in the link popup, but the link you create is applied to the selected text, and the link url is not shown in the text.
Is there some way I can disable this behaviour in the link plugin so that if the user has selected a text before adding the link, the text will be ignored, and the link with url as text will just be inserted after the pre-selected text?
FroalaEditor version is 4.0.11
I ended up removing the possibility to open the link popup. I removed the insertLink from toolbarButtons and quickInsertButtons. I also removed linkEdit and linkRemove from linkEditButtons.
I also have the url plugin active, so that whenever I insert a text in the editor that the Froala url plugin recognizes as a valid url, it is wrapped in an <a> tag which provides the styling for links as I want. I still have the link plugin active but with only with linkEditButtons: ['linkOpen', 'linkStyle'] to be able to open the link from the editor and select from a couple of link styles I have set up.
We have a webpage which has a tinyMCE editor tied to a DB. In this webpage we have some buttons like „Help”, „Settings”, „Logout” which can 'erase' (let's use this terminology) the content of our tinyMCE editor, because these buttons open another layout(s) in which, of course, the editor is absent.
We want to trigger our „Save to Db” subsystem when the user:
Clicks anyone of buttons which destroy the editor (see above)
Destroy the tinyMCE editor by closing the tab / browser.
Destroy the tinyMCE editor by navigating somewhere else (eg. from ourSite.com to google.com)
Now we tested all the above and (of course) the content isn't saved.
How can we achieve this automatic save on destroy?
The solution must work on Chrome/Edge, Firefox and Safari.
Notes:
we tried this demo: https://fiddle.tiny.cloud/hRhaab/2 (hooking the „remove” event) but it doesn't seem to work.
an alternative popup with „The data is not saved. Do you want to continue?” is also acceptable.
the data is rather small. No images, just some text (few A4 pages at most).
in the case of buttons, we try to avoid the obvious solution by writting a DoSaveMyEditor() under each button
Any help?
You can utilize the TinyMCE Autosave plugin. It does the job by itself but saves the data to local storage. However, it can be identified by setting an autosave_prefix and then taken out of the storage and uploaded to your DB.
So I'm working on a project where I'm building a website and I have many pages that include tabs from Bootstrap that use jQuery to work. They work really well and I love them but on my homepage I want to be able to link icons to specific tabs. Once clicked they should move the browser to that page and that tab should open instead of the default active tab. I've found numerous examples of javascript on how this would work but I don't know how I can get the JS to work on my SharePoint site.
// Javascript to enable link to tab
var url = document.location.toString();
if (url.match('#')) {
$('.nav-tabs a[href=#'+url.split('#')[1]+']').tab('show') ;
}
// Change hash for page-reload
$('.nav-tabs a').on('shown.bs.tab', function (e) {
window.location.hash = e.target.hash;
})
Twitter Bootstrap Tabs: Go to Specific Tab on Page Reload or Hyperlink
The above code is from that answered question and I'm wondering if someone can show me how to use this on my SharePoint pages.
So, I've worked on this a ridiculous amount of time for the problem I was actually having. I used the above code along with Bootstrap 3 and jQuery with CDN links in the page. That was correct. I also used the right notation for the url which is www.examplehere.com/blahblah#tab_tab1. The problem I was having was that I loaded this script at the top of the page, prior to the HTML 5 actually loading and making the tabs contained in the body on the SharePoint site. This meant that it went through the code to switch the open tab to the one dictated by the url but the code didn't have anything to change the tabs to since the tabs didn't exist.
So if you want this to work in SharePoint 2013. Save the above code as a .js file, link to it via a Content Editor Web Part, use the urls with the #tab_tab1 syntax as above, and please do yourself a favor and put the Web Part at the bottom of the page unlike I did.
I want to add an image upload button to the WordPress edit form and retrieve the ID of the uploaded media.
If it is possible, I want the user to click the button, choose his image on his computer and then display a tag containing the ID of the media in the textarea. Do you know a way to do that?
Thanks
I found by myself how to add and use a media button. If someone else is searching for that, I wrote a tutorial about doing this on SitePoint. You can also find a French version on my blog.
Basically, it uses the action media_buttons which is currently not listed on the WordPress Codex. This action is called when media buttons are displayed in the WordPress editor: all you have to do is displaying your own button with a dedicated function.
Then, you can open a media window and retrieve the user's selection thanks to a good (but hidden!) API.
When I try to insert a link using the TinyMCE link plugin all that happens is I get an empty popup box.
It continuously tries to load:
tiny_mce/utils/mctabs.js
tiny_mce/utils/form_utils.js
tiny_mce/utils/validate.js
tiny_mce/themes/advanced/js/link.js
I've seen solutions where you need to edit a config.php file, but I only have the JS version of TinyMCE
It happens to me all the time in Opera, but not in other browsers. Try refreshing the empty popup you get and you'll probably get its contents.