Go to main content

Textpattern CMS support forum

You are not logged in. Register | Login | Help

#1 2010-04-12 16:52:41

Liuhuparta
New Member
From: Finland
Registered: 2010-04-12
Posts: 3
Website

How to customize the comments form

I’m having really hard time trying to customize the layout of my sites comment form. Can I apply styles to preview and send buttons? What about the form itself?

Iwant this:
http://samilaakso.viuhka.fi/my-life#cpreview (it’s a bit skrewed because of my testing right now)

To look like this:
http://samilaakso.viuhka.fi/ota-yhteytta

It would be simple if I could apply a style to codes like this:
<txp:comment_preview />

I tried to replace it with lines I copied from the source code but then it doesn’t work right.

Offline

#2 2010-04-12 18:52:00

Gocom
Developer Emeritus
From: Helsinki, Finland
Registered: 2006-07-14
Posts: 4,533
Website

Re: How to customize the comments form

You can style the buttons by using the IDs provided (#txpCommentSubmit, #txpCommentPreview).

#txpCommentSubmit {
	width: 123px;
	height: 25px;
	border: 0;
	margin: 0 0 13px 10px;
	background: url(images/nappulat.png) no-repeat -459px 0;
	/*
		Hides Text and outline.
	*/
	font-size: 1px;
	outline: 0;
	color: #fff;
	text-indent: -1000em;
	float: right;
}
#txpCommentPreview {
	[...]

Offline

#3 2010-04-12 21:17:40

Liuhuparta
New Member
From: Finland
Registered: 2010-04-12
Posts: 3
Website

Re: How to customize the comments form

Thanks! Vai pitäisikö sanoa kiitos?

There’s still one tiny problem. I can’t get the text (value) from the button to disappear.

Last edited by Liuhuparta (2010-04-12 21:33:53)

Offline

#4 2010-04-13 02:41:15

Gocom
Developer Emeritus
From: Helsinki, Finland
Registered: 2006-07-14
Posts: 4,533
Website

Re: How to customize the comments form

Liuhuparta wrote:

Thanks! Vai pitäisikö sanoa kiitos?

Ihan kumpi vaan :-)

There’s still one tiny problem. I can’t get the text (value) from the button to disappear.

As long as the text is aligned to left, the negavite text-indent should remove the text. And it should work on every modern browser except for IEs.

This thread @ Stackoverflow forum might give some helpful pointers. Actually almost every method is mentioned there.

I personally use floating and negative text-indent. 1px text-size is there as a fix for IEs.

Offline

#5 2010-04-13 14:52:47

Liuhuparta
New Member
From: Finland
Registered: 2010-04-12
Posts: 3
Website

Re: How to customize the comments form

Thanks. All problems solved.

Offline

Board footer

Powered by FluxBB