WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] custom submit button in a form not showing image (3 posts)

  1. iversoncru
    Member
    Posted 11 months ago #

    hi there!
    i have a form with a submit buttom to subit comments.
    I wanted to custom the buttom using an image, it works but the image is not showing, it shows sth like this: http://www.underconsideration.com/brandnew/archives/google_broken_image_00_a_logo.gif

    here is my code:

    <form action="<?php echo get_option('siteurl'); ?>/wp-comments-post.php" method="post" id="comment_form">
    	<label for="comment">Post a comment</label>
    	<textarea name="comment" id="comment" cols="75%" rows="4" tabindex="1"></textarea>
    	<ul id="comment_label">
    		<li>
    			<label for="author">Name <span class="required"><?php if($req) echo "*required"; ?></span></label>
    		</li>
    		<li>
    			<label for="email">E-mail <span class="required"><?php if($req) echo "*required"; ?></span></label>
    		</li>
    		<li>
    			<label for="submit">Submit </label>
    		</li>
    	</ul>
    	<ul id="comment_box">
    		<li>
    			<input type="text" name="author" id="author" value="<?php echo $comment_author; ?>" size="28" tabindex="2" />
    		</li>
    		<li>
    			<input type="text" name="email" id="email" value="<?php echo $comment_author_email; ?>" size="28" tabindex="3" />
    		</li>
    		<li id="submit_li">	
    
    			<input type="image" name="submit" id="submit" src="images/fineblackline_blogopen_submitbutton.png" tabindex="4" />
    			<input type="hidden" name="comment_post_ID" value="<?php echo $id; ?>" />
    		</li>
    	</ul>
    	<?php do_action('comment_form', $post->ID); ?>
    </form>

    What am i doing wrong?

    this is my css:

    #comment_form{
    	margin-top: 7%;
    }
    label[for=comment]{
    	font-family: 'Sverige';
    	font-size: 1.7em;
    	line-height: 1.3em;
    }
    textarea#comment{
    	font-family: 'Eraslght';
    	font-size: 1.1em;
    	line-height: 1.4em;
    }
    label[for=submit]{
    	font-family: 'Sverige';
    	color: #FF2562;
    	/*padding-left: 2%;*/
    }
    #comment_form ul li{
    	display: inline;
    }
    input[type=text]{
    	font-family: 'Eraslght';
    	font-size: 0.6em;
    	line-height: 1.4em;
    }
    
    .required{
    	font-family: 'Eraslght';
    	font-size: 0.6em;
    	line-height: 1em;
    }
    ul#comment_label{
    	margin-top: 3%;
    	font-family: 'Sverige';
    	font-size: 1.7em;
    	line-height: 1.3em;
    	padding: 0;
    }
    ul#comment_label li{
    	margin: 0 12% 0 0;
    }
    ul#comment_box{
    	margin-top: 1%;
    	font-family: 'Sverige';
    	font-size: 1.7em;
    	line-height: 1.3em;
    	padding: 0;
    }
    ul#comment_box li{
    	margin: 0 0 0 0;
    	height: 37px;
    }
    ul#comment_box li#submit_li{
    	width: 47px;
    	height: 37px;
    }
  2. iversoncru
    Member
    Posted 11 months ago #

    the problem was in the path to the image which now is:

    <li id="submit_li">
    	<input type="image" name="submit" id="submit" src="<?php echo get_template_directory_uri(); ?>/images/fineblackline_blogopen_submitbutton.png" tabindex="4" width="46" height="36" />
    	<input type="hidden" name="comment_post_ID" value="<?php echo $id; ?>" />
    </li>

    i hope it helps

  3. iversoncru
    Member
    Posted 11 months ago #

    that's all

Reply

You must log in to post.

About this Topic