CKEditor in php website - php

I am going to use CKEditor to format the text while editing the content of my website. The content is saved into MySQL database, so if I use CKEditor, will the text be saved with its formats (size, color, etc) and displayed with that format in client side?

Yes and no. Not really.
Some information will be saved, yes, but some other will require the CSS of the editor page and the display page to match. They usually do, but not necessarily.
CKeditor offers several ways of customizing the HTML that's being generated. Your best option would be to use CSS classes for SPAN and DIVs, and all other tags you allow in the editor; then, define those in a separated .css file that would be imported by your CKeditor edit page as well as the site at large. This will give you as much WYSIWYG as you're going to get.
(I'll try and whip up an example later when I get access to a CKeditor on my servers; but you can also looks at CKeditor' documentation).

Yes CK editor will save the way you specify. On CK editor you have a source button if you click on it you will get the html source.

Related

Wordpress article and dynamic data/graphs, images to PDF

I'm using Wordpress to manage a newsletter with IssueM, also I need to be able to export the content of a group of articles to PDF (Keep in mind that I'm not a php hardcore developer).I'm using Advanced Custom Fields to generate some data and then creating graphs using NVD3 with javascript.
At this time, all the plugins I found to create PDF's did not work, they only "print" the title of the post(article in IssueM) and nothing else.
I need to be able to export the content, rendered graphs and tables with images, to PDF as they appear in the browser (styled via CSS in my page).
I found there is FPDF, and mPDF, also DOMPDF but they don't specify if they can render the javascript output (which are my NVD3 rendered graphs) to PDF.
Is there any tool that can acomplish this? or,
Do I have to do this by hand? If that's the case, can you tell me an approach?
Have you had a look at:
https://wordpress.org/plugins/printfriendly/
You should be able to add/remove/customize elements that print out:
http://support.printfriendly.com/publisher/developer-questions/include-exclude-content/
It should render javascript because it is using javascript (make sure you enable javascript use in the plugin):
http://support.printfriendly.com/publisher/wordpress/javascript-option/
Hope that helps!

Convert HTML Div content to Image

I am trying to make an image editor kind of page. Person can add text and styles to the background image. Everything i have done through HTML, Jquery and css, but struck up with export it to an image. I want to convert the particular div into image.
Note: I already know HTML to image conversion is possible through SVG and HTML5 Canvas. I cannot do those things because of browser compatibility.
If any PHP classes or jquery plugin is available please help me.
I think it is not possible without HTML5 features on the client side directly. May be I wrong?
My solution is to send the entire div (with styles) to backend server, where capture a screenshot with PhantomJS or Qt Webkit. On the server side you shoold open the DIV user created as it displayed in user browser and then make screenshot of this DIV.

Creating and displaying full details

I have mini forum site im coding and when users make their profile they get to add a little info about themselves. I want them to be able to make list elements and add images into this description, as well as make /n (drop a line). How can I do this from a simple input text area? is there any jQuery text area plugins someone can recommend.
As it stands I have the users start any list elements (bullet points) with * and then just septate out the lines and stick them in list elements, for images I make them upload the image, they get a ref number and put that in the box between two sets of ++.
This is not very user friendly, anyone have any suggestions or plug-ins i could use to better this?
Sounds like you need a HTML editor such as TinyMCE. This will change a textarea into a HTML editor, which will give your users the ability to format the content with lists and images etc etc.
have a look at the following plugins available for your need. CL Editor, [CK Editor] (http://ckeditor.com/), TinyMCE.

How to implement a Rich Text Editor with uploadable images anywhere inside text

I would like to implement a RTE (Rich Text Editor) with the ability to upload images anywhere inside the text. My aim is to create an "add / edit news article" page, where the client can write a story with images.
I am good at PHP and Javascript programming, so I am looking for help about methods of implementing this. Do I create a custom button in this RTE to insert a previously uploaded image or some other way? How do I display those images for the user to choose? Etc.
Bonus points for:
Multiple files upload: the ability for the client to just select e.g. 10 images that are relevant to this story.
Uses some method other than Flash as a default for upload.
Uses jQuery as I use it a lot.
RTE is very lightweight. I don't care if the client has to know a few things (like markdown or something similar), I just don't like bloated RTEs.
Uses new technologies, like HTML5 and / or CSS3.
Let me clarify a few things. I know a few Javascript RTEs and have also used them in several CMSs. So I don't need links to these, I can Google "javascript RTE" myself :). However, something like #hakre said is useful as he pointed out how extensible CKEditor is, which I was not fully aware.
To give an example of the answer I'm looking for: "you can do this with CKEditor, upload images asynchronously with jquery-html5-upload, save all uploaded image filename in a Javascript array, create a new button inside CKEditor with a custom click handler, which displays an overlay with Fancybox and you show all the images (you have filenames stored in an array), user clicks an image and you insert html into the editor".
Something like that but better :) (or should I say accurate).
Anything in here that meets with your reqs? http://ckeditor.com/developer-features
You taken a look at TinyMCEor CKEditor?
The "fake answer" you gave yourself is quite accurate. You would need a RTE editor that supports custom functionality.
The logistics would go along these lines:
User presses a button
An empty div is appended to the input with a unique id
An image uploader popup will open, with pointers to the new div
A combination of jQuery / AJAX / PHP will allow the user to upload a file within the page
The filename is returned after the upload process and inserted in the originally appended div
If you are looking for the specific code for each of these steps, I would recommend finding some tutorials as this isn't something that we can write some fast example code for.

Need to create image from content of div

I want to create a programme that can
take text input from user and adjust anywhere in specific div
change font, fontcolor and size as per user selection
upload image as background
save whole customization and send as email
with help of PHP/JavaScript
Can anyone suggest how to do this.
Main issue is create image from user customization.
An existing programme to do this is also acceptable
I am programmer and working on php javascript magento
EDIT
Reading your description, it doesn't sound like you really need a screencapture-like version of the content the user created, you just need an HTML embedded editor and a way for someone to upload an image as the background with a way to preview the result. You can send emails with backgrounds using CSS.
(Not sure what you mean, but I presume you can figure this one out)
Use TinyMCE for an editor: http://tinymce.moxiecode.com/
Use jQuery AJAX file upload plugins (maybe http://www.uploadify.com/)
Submit the form (with the selected settings and edited html) to server and process as email
Try here for how to add an image to the background of an email:
http://www.campaignmonitor.com/blog/post/3170/adding-background-images-to-your-email-in-two-simple-steps/

Categories