(html) wysiwyg editor for TEXT fields in phpmyadmin - mysql

i'm making a small website and i need whoever takes over to add some content, stored in three tables which by sep '13 will have at most 500 records (small stuff). right now i'm using phpmyadmin, but adding text (one of the tables is a mini blog) requires basic html skills, which i'm sure "whoever takes over" doesn't have. do you know, alternatively:
a) a way to integrate a wysiwyg editor with phpmyadmin (at least for the TEXT fields)
b) an essential frontend to mysql which supports editing tables (just the content, not the structure) – in which i might embed an editor myself?
edit: thanks for the editor suggestions, but that's a secondary problem: at the moment i'd need a way to embed any such editor to phpmyadmin (otherwise i'd have to write the frontend myself)...

I think CK editor is what you are looking for, you can see for yourself here: http://ckeditor.com/

Here is a solution for you, I have to say that doing this is completely wrong, but if you really need it, then here is the way:
Get TinyMCE from here:
http://www.tinymce.com/
Extract the package in your phpmyadmin folder, for example in my case I put the main contents here: D:\Program Files\Wamp\apps\phpmyadmin\tiny_mce so the tiny_mce.js file is located at this patch D:\Program Files\Wamp\apps\phpmyadmin\tiny_mce\tiny_mce.js
Then open the file tbl_change.php in your phpmyadmin folder and add the flowing code after <?php:
echo '<script type="text/javascript" language="javascript" src="tiny_mce/tiny_mce.js"></script>'
.'<script language="javascript" type="text/javascript">'
.'tinyMCE.init({'
.'theme : "advanced",'
.'mode : "textareas",'
.'language : "en"'
.'});'
.'</script>';
This will add the TinyMCE in all textareas of editing a record in phpmyadmin, if you needed it somewhere else, just take a look at what file is being loaded in phpmyadmin right iframe, and add that code to that file too.
I repeat that doing this is completely wrong, just do it if you really need it.

I am using jHtmlArea, a jQuery plugin, as a very simple and quick way to implement a solution for a case just like yours: http://jhtmlarea.codeplex.com/
It is really really simple to use it, in the front-end. But I have not used phpMyAdmin nor any other "essential frontend". I have coded a simple back-end PHP script to save the contents into the database.
In the back-end, I am also using HTML Purifier to clean the HTML, and HTML Tidy to prettify it.

This is also useful TinyMCE "www.tinymce.com" , this WYSIWYG is seen in wordpress

Related

Making "personalized variables" in html

Okay, my english is not the greatest so I apologize in advance. Question is really stupid and I dont know how that is called but I will try to explain it here better. So I am making a template for one restourant and menus are changing every week. So is it possible to write paragraphs somewhere else ( in separated place (external or internal)) and then "call them" somewhere in .html.
Example. making methods in C# and then calling them anywhere when we want to
In my opinion the simplest method will be to use php.
Then in place with menu you can only use something like this:
<?php inlcude('menus/file.php');
And on server create a folder menus where you wil put php files with html.
All files can be simple html. There is no need to learn php just in place you want to call a file use code i placed earlier.
HTML doesn't have a good way to achieve this (although iframe exists).
This sort of thing is generally handled by software that generates the HTML, either when the page is requested (via something like the very basic SSI support in some webservers to full on server side programming (which you could use C# for)) or at publication time (via a build tool such as Gulp).
You could use jQuery to achieve it (if it is a simple website and simple menu), read more the related function on http://api.jquery.com/load/
You may also read a simple here: HTML File including another HTML file
I may also include a very basic example for you
main.html
<body>
<header>Some header</header>
<content>
<main class="the-menu"></main>
</content>
<script>
$(".the-menu").load("menu.html");
</script>
</body>

Way To Modify HTML Before Display using Cocoa Webkit for Internationalization

In Objective C to build a Mac OSX (Cocoa) application, I'm using the native Webkit widget to display local files with the file:// URL, pulling from this folder:
MyApp.app/Contents/Resources/lang/en/html
This is all well and good until I start to need a German version. That means I have to copy en/html as de/html, then have someone replace the wording in the HTML (and some in the Javascript (like with modal dialogs)) with German phrasing. That's quite a lot of work!
Okay, that might seem doable until this creates a headache where I have to constantly maintain multiple versions of the html folder for each of the languages I need to support.
Then the thought came to me...
Why not just replace the phrasing with template tags like %CONTINUE%
and then, before the page is rendered, intercept it and swap it out
with strings pulled from a language plist file?
Through some API with this widget, is it possible to intercept HTML before it is rendered and replace text?
If it is possible, would it be noticeably slow such that it wouldn't be worth it?
Or, do you recommend I do a strategy where I build a generator that I keep on my workstation which builds each of the HTML folders for me from a main template, and then I deploy those already completed with my setup application once I determine the user's language from the setup application?
Through a lot of experimentation, I found an ugly way to do templating. Like I said, it's not desirable and has some side effects:
You'll see a flash on the first window load. On first load of the application window that has the WebKit widget, you'll want to hide the window until the second time the page content is displayed. I guess you'll have to use a property for that.
When you navigate, each page loads twice. It's almost not noticeable, but not good enough for good development.
I found an odd quirk with Bootstrap CSS where it made my table grid rows very large and didn't apply CSS properly for some strange reason. I might be able to tweak the CSS to fix that.
Unfortunately, I found no other event I could intercept on this except didFinishLoadForFrame. However, by then, the page has already downloaded and rendered at least once for a microsecond. It would be great to intercept some event before then, where I have the full HTML, and do the swap there before display. I didn't find such an event. However, if someone finds such an event -- that would probably make this a great templating solution.
- (void)webView:(WebView *)sender didFinishLoadForFrame:(WebFrame *)frame
{
DOMHTMLElement * htmlNode =
(DOMHTMLElement *) [[[frame DOMDocument] getElementsByTagName: #"html"] item: 0];
NSString *s = [htmlNode outerHTML];
if ([s containsString:#"<!-- processed -->"]) {
return;
}
NSURL *oBaseURL = [[[frame dataSource] request] URL];
s = [s stringByReplacingOccurrencesOfString:#"%EXAMPLE%" withString:#"ZZZ"];
s = [s stringByReplacingOccurrencesOfString:#"</head>" withString:#"<!-- processed -->\n</head>"];
[frame loadHTMLString:s baseURL:oBaseURL];
}
The above will look at HTML that contains %EXAMPLE% and replace it with ZZZ.
In the end, I realized that this is inefficient because of page flash, and, on long bits of text that need a lot of replacing, may have some quite noticeable delay. The better way is to create a compile time generator. This would be to make one HTML folder with %PARAMETERIZED_TAGS% inside instead of English text. Then, create a "Run Script" in your "Build Phase" that runs some program/script you create in whatever language you want that generates each HTML folder from all the available lang-XX.plist files you have in a directory, where XX is a language code like 'en', 'de', etc. It reads the HTML file, finds the parameterized tag match in the lang-XX.plist file, and replaces that text with the text for that language. That way, after compilation, you have several HTML folders for each language, already using your translated strings. This is efficient because then it allows you to have one single HTML folder where you handle your code, and don't have to do the extremely tedious process of creating each HTML folder in each language, nor have to maintain that mess. The compile time generator would do that for you. However -- you'll have to build that compile time generator.

How to change format of Warning admonition or add Caution in Sphinx HTML output

This seems like it should be straightforward but I've been prowling the documentation and web and haven't found the answer.
I want to output HTML doc from Sphinx. Ideally I'd like to have three levels of "note" type highlighted text boxes. ReST defines several "admonitions": (http://docutils.sourceforge.net/docs/ref/rst/directives.html#admonitions) but most of the Sphinx HTML themes include special formatting only for Note and Warning. (I am using one of the preinstalled themes, Classic.)
I have two questions:
1) How can I customize the color behind Warning in my documents?
2) How can I add a formatting style for Caution?
I see that these all end up with tags like <div class="admonition warning"> ... in the HTML output. But I can't find where the formatting for that class is defined. Is it in a stylesheet? Is it in a layout.html file or some other file?
Is there anything that explains how the various files in themes actually interact with each other? I haven't found a good primer. (I am no expert on css-based HTML either, so maybe that's part of the problem.)
Okay, I figured out more and have a working workaround. (I'm still not sure how I'm supposed to handle this.)
Looks like my HTML code is reading directly from a few cascading stylesheets stored along with the output in a directory called _static. There's classic.css, which inherits from basic.css.
I don't understand how these relate to the files named like basic.css_t that live in the Python Sphinx install.
To change things, should I (A) try altering the _t files? or (B) create an altered local copy of classic.css that lives in my source directory?
If I go with B, more questions.
Will it be overwritten by the values in the css_t template at build time? (I guess this is easy enough to test)
Is it good practice to use the same filename for a modified version of that stylesheet?
Here's a workaround that avoids those questions and seems to be doing what I want - from this: https://github.com/snide/sphinx_rtd_theme/issues/117
I created an override stylesheet that includes just the formatting I want to change.
I stored it in the _static of my source directory.
I defined it in my conf.py as follows:
html_context = {
'css_files': [
'_static/theme_overrides.css',
],
}
Now, that github discussion said that this wasn't a solution for all kinds of themes (including the RTD theme mentioned in the question) but I think I'm safe for now.
What more should I know?

Inserting or copy/pasting picture to a textbox

I have a file with a textarea (named "Resolution support") in which you can explain how to solve a problem. My problem is that a user would be able to add a picture for a better explaining. If he copy/paste or he has to click and drag or anything i don't care, he HAS TO be able to put a picture into the textarea.
I wondered if another textbox that can do this would exist and what Type does the textbox has to be in PhpMyAdmin.
My textarea :
<textarea name="Escalade" class="longInput" cols="80%" rows="19" wrap="hard">
</textarea>
Without some kind of JavaScript WYSIWYG library this is not possible as vanilla textarea only takes text (clue is in the name).
I assume that you are viewing the submissions in phpMyAdmin which is an interface onto a MySQL database. It is good for developing stuff but not so great as an admin user interface long term. What you are asking about are called transformations.
Here are some tutorials on storing images in a database:
http://www.hockinson.com/programmer-web-designer-denver-co-usa.php?s=47
http://w3schools.invisionzone.com/index.php?showtopic=48068
How to store file name in database, with other info while uploading image to server using PHP?
Here are some lists of WYSIWYG editors:
http://www.sitepoint.com/html5-wysiwyg/
https://github.com/cheeaun/mooeditable/wiki/Javascript-WYSIWYG-editors
Those phpMyAdmin transformations:
http://docs.phpmyadmin.net/en/latest/transformations.html
That is about as much help as can be offered to you without seeing the PHP code behind the form at the very least. Hope this helps.
If someone is looking for an answer, I had asked my profesor and he answered that what I was looking for is a "Rich Text Editor". I'm using ckeditor with the plugin prgfilemanager. It allows me to insert pictures but I cannot copy/paste them which is pretty annoying...
You can try it here http://ckeditor.com/demo I hope it will help you if you have the same problem that I had :)
While it is true that you cannot use a textarea, the answer is very simple. You can use a content editable div, grab the contents as html and write it to a databae using AJAX and PHP.
Just name a div like this:
<div class="my_article" contenteditable></div>
and pass the contents on the click of a button into a JS variable and then pass that into PHP using AJAX.
var content1 = $('.my_article').html();
If anyone needs further help please comment and I'll be happy to obligue.

Something like Include for HTML in VS2010 at build time

Is there a way to split a single HTML page (purely static, HTML + JS) in VS2010 (I use VS2010 + ReSharper for my HTML /Js coding) into parts, but get / build a single page at build time.
There was such a feature with Dreamweaver (I have used this years back, think it called libraries). If I was using PHP I'd use something like Include at runtime.
My page contains several div sections serving as tabs, only one visible at time. I want to place the code between these tabs in a single file, to make it easier to maintain. But in the end I do need one single, static HTML file. Again, I want to do this a build time, not at server side.
<DIV>
many lines of HTML
</DIV>
should be replaced by something like
<DIV>
#include tab1.html
</DIV>
I could write a script building the static page and hook it into VS2010, but is there some extension or function already existing?
-- Follow ups on using T4 ---
VS2010 - Assign html code formatting to T4 (.tt) file
VS2010 - disable validation for particular html file (not all files)
I ran across this question while searching for something else. You've probably moved on, but what the heck, maybe the answer will help someone else:
You could get so-called T4 templates to do this:
http://msdn.microsoft.com/en-us/library/bb126445.aspx
Alternately, Microsoft has similar capabilities in Razor, and it's more specific to HTML.
Here is a comparison of the two:
http://blogs.msdn.com/b/garethj/archive/2011/03/11/t4-vs-razor-what-s-the-skinny.aspx