Thread Rating:
  • 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
[Request] Quoted Text Plugin (Details inside)
#1
Hi there,
I'm working on my CCW (Client Care Website) and I need some plugin that will look similar to the following image: (found on Google)
[Image: wordpress.gif]
But the thing is, it cannot be just inserted image, it won't look good, and will be harder to make on many many pages, I need it like a tag...
Actually, it could be like in here:
Quote:Quoted Text
But with a little header says "Quote:"...
Can someone think about an idea on how to make this?

Thanks and have a nice day,
TDT-Alpha.
http://thedragonteam.myftp.org/
http://Blog.TDT-Alpha.com/
(Website will be replaced soon, with an image database made with GS)
#2
cant you in the page edit change the hmtl directly and let this quoted text section inherit from class that you manipulate via css ? then you have the control you need ?
Stopped developing on GS Plugins. Anybody welcome to take the projects over. Thanks for all the support all.
#3
TDT-Alpha Wrote:Hi there,
I'm working on my CCW (Client Care Website) and I need some plugin that will look similar to the following image: (found on Google)
[Image: wordpress.gif]
But the thing is, it cannot be just inserted image, it won't look good, and will be harder to make on many many pages, I need it like a tag...
...
Can someone think about an idea on how to make this?

Add custom styles to your WYSIWYG editor like described here.

I suggest a definition like this:
Code:
{ name : 'Quote', element : 'p', attributes : { 'class' : 'quote' } },
Then add appropriate styles to your css file, e.g.:
Code:
.quote {
  background-image: ...; /* for the quotes */
  color: green;
  font-style: ...;
  ...
}
I18N, I18N Search, I18N Gallery, I18N Special Pages - essential plugins for multi-language sites.
#4
dominionit Wrote:cant you in the page edit change the hmtl directly and let this quoted text section inherit from class that you manipulate via css ? then you have the control you need ?

TF? I didn't get anything... And what does 'inherit' means??

mvlcek Wrote:
TDT-Alpha Wrote:Hi there,
I'm working on my CCW (Client Care Website) and I need some plugin that will look similar to the following image: (found on Google)
[Image: wordpress.gif]
But the thing is, it cannot be just inserted image, it won't look good, and will be harder to make on many many pages, I need it like a tag...
...
Can someone think about an idea on how to make this?

Add custom styles to your WYSIWYG editor like described here.

I suggest a definition like this:
Code:
{ name : 'Quote', element : 'p', attributes : { 'class' : 'quote' } },
Then add appropriate styles to your css file, e.g.:
Code:
.quote {
  background-image: ...; /* for the quotes */
  color: green;
  font-style: ...;
  ...
}

Doing...
Where should I add the {define} thingy? When I put it in the config.js (inside admin\template\js\ckeditor) the whole editor disappears...
http://Blog.TDT-Alpha.com/
(Website will be replaced soon, with an image database made with GS)
#5
TDT-Alpha Wrote:Doing...
Where should I add the {define} thingy? When I put it in the config.js (inside admin\template\js\ckeditor) the whole editor disappears...

See the wiki link.
I18N, I18N Search, I18N Gallery, I18N Special Pages - essential plugins for multi-language sites.
#6
O.K did it all and should work but it doesn't, here's the CSS:

Code:
.quote {
  background-image: "http://thedragonteam.myftp.org/images/quote.png"; /* for the quotes */
  background-position: left;
  color: #09F;
  font-style: italic;
  margin-left: 25px;
}

It's in the Theme's style.css...

Actually, it does show up, it is in the right color but no image... The image is in the rught folder with the right name..

See client page:
http://thedragonteam.myftp.org/index.php?id=clientnum
http://Blog.TDT-Alpha.com/
(Website will be replaced soon, with an image database made with GS)
#7
TDT-Alpha Wrote:O.K did it all and should work but it doesn't, here's the CSS:

Code:
.quote {
  background-image: "http://thedragonteam.myftp.org/images/quote.png"; /* for the quotes */
  ...
}

If you looked at the syntax of css, e.g. here, you would see that the syntax is rather:
Code:
background-image: url('/images/quote.png');

I suggest you use the Firefox plugin Firebug or the debugger of Chrome to look at HTML and CSS: There you can easily see, if an image is used or not. Or if a CSS rule takes precedence before another one...
I18N, I18N Search, I18N Gallery, I18N Special Pages - essential plugins for multi-language sites.
#8
O.K finally managed to make that work...
Soooo much work, I think I'll learn PHP and post a plugin for it.. For the community here..

Example pages:
http://thedragonteam.myftp.org/index.php?id=clientnum
http://thedragonteam.myftp.org/

CSS:

Code:
.quote {
  background-image: url('/images/quote.png'); /* for the quotes */
  background-repeat: no-repeat;
  color: #09F;
  font-style: italic;
  margin-left: 0px;
  min-height: 50px;
  padding-left: 15px;
  padding-top: 15px;
  margin-bottom: -15px;
}
http://Blog.TDT-Alpha.com/
(Website will be replaced soon, with an image database made with GS)
#9
TDT-Alpha Wrote:O.K finally managed to make that work...
Soooo much work, I think I'll learn PHP and post a plugin for it.. For the community here..


TDT-beta (just a joke),

I think you must learn more than PHP because this topic here is pure CSS + CKEditor, nothing with PHP

I get the impression that you demand too much at once, start reading our wiki first, it will help you a lot

Cheers and good success,

Connie
|--

Das deutschsprachige GetSimple-(Unter-)Forum:   http://get-simple.info/forums/forumdisplay.php?fid=18
#10
I created a dynamic text replacement plugin but never released it. See it work here:

http://testbed.cartocopia.com/test-page/

it renders the text in the tag as an image, styled according to default settings or settings that can specified in the tag.

I attached a version of here: http://get-simple.info/forum/topic/1394/...placement/

-Rob A>
#11
RobA Wrote:I created a dynamic text replacement plugin but never released it. See it work here:

http://testbed.cartocopia.com/test-page/

it renders the text in the tag as an image, styled according to default settings or settings that can specified in the tag.

I attached a version of here: http://get-simple.info/forum/topic/1394/...placement/

-Rob A>

Wow, If I would hav eknown this plugin it would have saved me about a half of an hour of coding.... Thanks..
I'll try to use it.

Please close the thread, I've got all I need and other people may, too. Smile
http://Blog.TDT-Alpha.com/
(Website will be replaced soon, with an image database made with GS)
#12
I close it
|--

Das deutschsprachige GetSimple-(Unter-)Forum:   http://get-simple.info/forums/forumdisplay.php?fid=18




Users browsing this thread: 1 Guest(s)