TheFilmGod Posted August 21, 2009 Share Posted August 21, 2009 I would like to add smileys to my blog - but keep it basic basic very basic. Pretty much a simple textarea with the option to add a smiley here and a smiley there. Trick is, I would like the smileys to be added at the cursor's location and even replace text if it's highlighted. - Just like it's done on phpfreaks, but I don't want all the other fancy tags (bold, italics, pictures, font size or face, etc)... Maybe someone knows of a good tutorial or someone can lead me to the right direction. Google hasn't been very helpful. Quote Link to comment Share on other sites More sharing options...
Adam Posted August 21, 2009 Share Posted August 21, 2009 Perhaps this could be helpful to you: http://www.almsamim.com/create-your-own-advanced-wysiwyg-editor-part-1-t10.html I've not read it myself but the comments seem positive. I dare say in order to create your own custom 'basic' editor, you're probably going to have to learn some of the advanced stuff as well. Quote Link to comment Share on other sites More sharing options...
Philip Posted August 21, 2009 Share Posted August 21, 2009 Take a look at (it should get you started... even though it is an older entry): http://alexking.org/blog/2003/06/02/inserting-at-the-cursor-using-javascript Quote Link to comment Share on other sites More sharing options...
Adam Posted August 21, 2009 Share Posted August 21, 2009 That wouldn't work with WYSIWYG editors though, would it? Quote Link to comment Share on other sites More sharing options...
Philip Posted August 21, 2009 Share Posted August 21, 2009 Why wouldn't it? OP stated he didn't need formatting, just inserting smilies, yes? And take a look at the demo (again, I know it's older but it still works) http://alexking.org/projects/js-quicktags/demo/index.html Quote Link to comment Share on other sites More sharing options...
Adam Posted August 21, 2009 Share Posted August 21, 2009 I though he meant like this... [attachment deleted by admin] Quote Link to comment Share on other sites More sharing options...
Daniel0 Posted August 21, 2009 Share Posted August 21, 2009 Hmm... I didn't know we had a WYSIWYG editor. Quote Link to comment Share on other sites More sharing options...
TheFilmGod Posted August 21, 2009 Author Share Posted August 21, 2009 I finally got it to work. I just needed some javascript to add "text" smileys at the cursor point. // Add symbol to textarea // Cache textarea textarea = document.getElementById('textboxer'); // IE support if (document.selection) { textarea.focus(); sel = document.selection.createRange(); sel.text = symbol; } //MOZILLA/NETSCAPE support else if (textarea.selectionStart || textarea.selectionStart == '0') { textarea.focus(); var startPos = textarea.selectionStart; var endPos = textarea.selectionEnd; textarea.value = textarea.value.substring(0, startPos) + symbol + textarea.value.substring(endPos, textarea.value.length); } // Default to appending the smiley at the end else { textarea.value += symbol; } Quote Link to comment Share on other sites More sharing options...
Philip Posted August 22, 2009 Share Posted August 22, 2009 Hmm... I didn't know we had a WYSIWYG editor. Yeah it's under Profile -> Look and Layout -> [X] Show WYSIWYG editor on post page by default? Quote Link to comment Share on other sites More sharing options...
Adam Posted August 22, 2009 Share Posted August 22, 2009 There's a button to toggle between them above the editor as well, little red 'A' on right. Quote Link to comment Share on other sites More sharing options...
TheFilmGod Posted August 23, 2009 Author Share Posted August 23, 2009 Edit: I didn't we had a WYSIWYG editor either! So I tried adding in a smiley and stretching it out but it doesn't post the image changes? Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.