manipulating tinymce in Wordpress - javascript

I need to be able to extract, manipulate and update the text in wordpress's tinymce #content textbox.The code is coded in a wordpress plugin.
The below post helps but i am unable to comment or contact the original creator to ask him further questions. Having 1 points I cant practically do anything except ask questions. Let me know if i am doing this wrong.
Basically the code from this link is what i need to manipulate or edit the content in wordpress tinymce editor.
Manipulating TinyMCE content with jQuery
But the code seems to be overly simplified.
so my question is:
Do i need to include jquery
Do i need to include the tinymce js or class? is it in wordpress itself?
The code seems to be half javascript half php? Is the code suppose to be coded in a .js file?
do i need to put php tags here?
// make it into a jQuery object
var $content = $(content);
// manipulate the jquery object using jquery
$content = $content.remove('a');
Thanks.

hi I have figured it out after a bit more researching.
At first I was working with php to manipulate data after it is saved. But then i went on to wanting to manipulate the text before it was saved like underlining certain text based on a list in the database. So I needed to move on to javascript because i was editing the text before it was submitted or a page reload which i didn't wrap my head around yet.
So next i just coded the changes into javascript and built a button to call the process.
and seems i didn't need to include the tinymce class because probably the header of the editor page has already included it.

Related

PHP / Javascript - how to locate suitable place for code?

I'd like to modify WP plugin's code.
This plugin dynamically creates table, assigns color to cells of this table.
I'd like to put a JavaScript code in this plugin, so the color of cells with a certain text inside is changed.
I have the code, it should work as it has been tested before.
I just don't know where to put this code to make it work. I tried to put it in the PHP file which creates the table but code in this file is not ended with "?>" which I suppose means that somewhere else is the rest of the code which is being added in the proces of creating the table.
It's possible that the table is being loaded via AJAX.
I have access to all the files so I can provide if necessary.
Would anyone be so kind and helped me locate suitable place for my code?
To add more javascript functionality to the third party plugin you should add your additional javascript code with wordpress' own function wp_enqueue_script. Somewhere in the third party plugin code the plugin is initialized. There you can add your file with the additional javascript code.

Google Analytics for Individual WordPress Pages [duplicate]

I'm trying to get Google Analytics Code to work on the thank-you page after customer has filled in the contact form and I've tried putting it in the thank-you page which is in the pages under admin in Wordpress backend using HTML tab but it seems to generate unnecessary p and br tags in between codes especially before closing tag. I'm not sure whether that is causing the issue or not.
Is there a way we can do this for just one page?
I'm not 100 % sure whether it's possible at all to insert javascript with the tinyMCE Editor of Wordpress.
If that's true, then you can try the following:
Get the posts' ID: Look at the linking in your admin menu when you are in the view where you can see all your posts, e.g.
http://www.your-url.com/wp-admin/post.php?post=796&action=edit
796 would be your ID here.
Enter the following in your header.php of your wordpress theme (to find at /wp-content/themes/theme-name):
.
<?php if (is_page(796)) { ?>
//YOUR ANALYTICS CODE IN HERE
<?php } ?>
Replace 796 with your ID here, and put your analytics code in between the PHP code.
It sounds like you're trying to add it using the "Visual" view, which formats whatever you put in into paragraphs, etc.
Try switching to "HTML" view (the tab is at the top right of the input box) and add it there - hopefully that should allow you to add it without converting it!
Edit: As per my comments below, I made a mistake - it seems even the HTML tab adds some degree of formatting.
In this case, you may find some use with this plugin:
http://wordpress.org/extend/plugins/raw-html/
This allows you to displable to auto formatting on a per-post basis. So on that specific page you could turn off the autoformatting simply to allow you to add that Analytics snippet.
The only other way I can think off offhand would be to write a custom page_template just for that thankyou page and add it to there. Instructions are here: http://codex.wordpress.org/Pages#Creating_Your_Own_Page_Templates

Summernote editor and script tags

I am building a web app which uses Summernote to allow for HTML editing.
Users are allowed to add and edit JavaScript as well, using inline <script> tags. This works fine and can be done in the editor's "Code View" mode.
What I'd like to do is, in the preview/WYSIWYG mode, instead of having the script being executed, just display an image (or text) to let the user know that there's a script there.
Something like:
I looked around and I don't think this has been done before. Is it possible? Any pointers on how I could accomplish this?
Thanks!
https://github.com/summernote/summernote/issues/495 explains how to do it using CSS only.

Inserting Text Into HTML

What I Want: Very simply I have a C program that generates a variable periodically, I want to be able to display this value on a website.
Restrictions: The webpage is HTML, php does not work, javascript does [I have tried a few javascript solutions but they have all been long, tedious and in the end ineffective] I want it to be able to format the text so that it matches the rest of the webpage. Above all I'd really like to find something simple that works.
Freedoms: I can output the variable from my C program to just about any file type and content that I want, the file is hosted so is available locally to the server or online for the client.
Preferred Solutions: I am currently playing around with the object and iframe tags native to html. They give a nice simple input:
<object height=20 width=75 type='text/plain' border=0 data="URL/filename.txt"></object>
inserts the contents of my file, but it can't be formatted so I am stuck with 12pt Courier font which is not acceptable. Using
<iframe seamless height=20 width=75 scrolling='no' src="URL/filename.htm"></iframe>
and adding my desired font/colour/size etc to the htm file gets me the right text style, but htm has a large amount of white padding around it which I can't seem to get rid of so I have to make my iframe quite large for the text to be displayed, but then it doesn't fit smoothly with other text.
So anyone that can answer one of four questions:
How to remove excess padding from htm
How to format the style of a html object
Is there anything in Java as simple as the php [so apparently it doesn't show php code even when you quote it as code. But basically using echo and get_file_contents to insert the contents of a txt file into a html page]
Propose an alternate solution
Padding and style can be handled by css.
By java I assume you mean javascript - google-ing will help you. Without details of what your server is running and what is dispatching your pages we can't give you an exact answer. You might want something with ajax to keep it updating in the background.
Try googling your question, you'd be surprised how often this helps.
I'm not sure what you're trying to do once you get the variable into your web page, but I think something like the following could be useful.
Create a hidden div on your page
Have your C application write the variable to some file
Use jquery to execute an ajax call to pull that value into the div ( or whatever other container you want to use
using some type of timer, execute the ajax call every X period of time, which will then get your up to date variable
on your main page, have another timer that will then come in to that container, grab your value and then you are free to do what you want with it.
This is all off the top of my head without knowing much about what you're trying to accomplish. If you provide some further details we may be able to help you a little more.
You need AJAX... that's just a fancy buzz-word. It means you can tell JavaScript can get a file from the server without reloading the page and you can insert data from that file into your HTML.
AJAX is made much simpler by using a JavaScript library like jQuery, but it can be done without jQuery. There's a pretty decent Getting Started tutorial at Mozilla Developer Network if you want to do it the hard way, but I really recommend jQuery.
As far as formatting... any formatting... you need to use CSS. Just about everything about the appearance of anything on a web page is controlled by CSS. MDN has a Learn CSS section, too.
load jquery on you main html file
put a div with some id (example id="newvalue")
make you c program to write the output in a file (for example value.html)
on main html page header, after jquery include code add some javascript like
$( document ).ready(function() {
$("#newvalue").load('yoursiteurl/value.html');
});

Changing the editor in Joomla deleted my javascript, unsaved...Any way to recover?

I used No editor option and joomla and wrote javascript. The code was working perfect. To add other articles I changed editor to TinyMCE, added a table. ...All my javascript is gone, even after I revert back to No editor. Anyway, I can get previous version of article with javascript. Has about 2 days of coding and unfortunately, stupid enough, I don't have back up
No way (unfortunately) to get what was saved before and overwritten afterwards.
Two solutions (if it was made after at least one day):
A. Maybe your server was set to backup the database?
If so, you could recover it via the backups.
B. If the site was indexed by Google (and public), try to view a cached version of that page (if accessible and indexed).
I just had the same issue. To prevent javascript disappearance, just put the javascript tag into html comments. The editor do not delete it and the javascript is still seen in HTML.
<!--
<script language="javascript">
...
</script>
-->

Categories

Resources