SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Member
    Join Date
    May 2013
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    php item alignment

    hi guys i recently installed terms_osc plugin on my osclass website. i tried everything to align "checkbox" and "i agree text" which is (Kullanici sozlesmesini okudum kabul ediyorum) on SAME ROW but couldn't do it.



    This is plugins form.php

    Code:
    <?php 
    View::newInstance()->_exportVariableToView('page', Page::newInstance()->findByInternalName('terms_osc'));
    ?>
    <div id="terms_osc_page" style="display:none;">
        <?php echo osc_static_page_text(); ?>
    </div>
    
    <label for="terms_osc_box">
    <input type="checkbox" id="terms_osc_box" name="terms_osc_box" value="1"/></label>
    <?php echo sprintf(__('<a id="terms_osc_a" href="example.com" >Kullanıcı Sözleşmesini</a> okudum kabul ediyorum</a>', 'terms_osc'), osc_base_url(), osc_base_url()) ; ?>
    <br />
    
    <link href="<?php echo osc_base_url().'oc-content/plugins/'.osc_plugin_folder(__FILE__);?>css/basic.css" rel="stylesheet" type="text/css" />
    <link href="<?php echo osc_base_url().'oc-content/plugins/'.osc_plugin_folder(__FILE__);?>css/demo.css" rel="stylesheet" type="text/css" />
    
    <script type="text/javascript" src="<?php echo osc_base_url().'oc-content/plugins/'.osc_plugin_folder(__FILE__);?>js/jquery.simplemodal.1.4.2.min.js"></script>
    <script>
    
    	$(document).ready(function(){
        $("#terms_osc_box").rules("add", {required: true, messages: { required: "<?php _e('It is obligatory to accept the Terms and Conditions.', 'terms_osc'); ?>" }});});
    	
        $("#terms_osc_a").click(function(){$("#terms_osc_page").modal();}); 
    
    </script>

    I changed to this but not worked

    Code:
    <label style="display:inline;" for="terms_osc_box">
    <input type="checkbox" id="terms_osc_box" name="terms_osc_box" value="1"/>
    <?php echo sprintf(__('<a id="terms_osc_a" href="example.com" >Kullanıcı Sözleşmesini</a> okudum kabul ediyorum</a>', 'terms_osc'), osc_base_url(), osc_base_url()) ; ?>
    </label>

    Also this here is my basic.css and demo.css of plugin

    Basic.css


    Code:
    /*
     * SimpleModal Basic Modal Dialog
     * http://www.ericmmartin.com/projects/simplemodal/
     * http://code.google.com/p/simplemodal/
     *
     * Copyright (c) 2010 Eric Martin - http://ericmmartin.com
     *
     * Licensed under the MIT license:
     *   http://www.opensource.org/licenses/mit-license.php
     *
     * Revision: $Id: basic.css 257 2010-07-27 23:06:56Z emartin24 $
     */
    
    #basic-modal-content {display:none;}
    
    /* Overlay */
    #simplemodal-overlay {background-color:#000; cursor:wait;}
    
    /* Container */
    #simplemodal-container {height:360px; width:600px; color:#bbb; background-color:#333; border:4px solid #444; padding:12px;}
    #simplemodal-container .simplemodal-data {padding:8px;}
    #simplemodal-container code {background:#141414; border-left:3px solid #65B43D; color:#bbb; display:block; font-size:12px; margin-bottom:12px; padding:4px 6px 6px;}
    #simplemodal-container a {color:#ddd;}
    #simplemodal-container a.modalCloseImg {background:url(../img/basic/x.png) no-repeat; width:25px; height:29px; display:inline; z-index:3200; position:absolute; top:-15px; right:-16px; cursor:pointer;}
    #simplemodal-container h3 {color:#84b8d9;}
    Demo.css

    Code:
    body {background:#fff; color:#333; font: 12px/22px verdana, arial, sans-serif; height:100%; margin:0 auto; width:100%;}
    h1 {color:#3a6d8c; font-size:34px; line-height:40px; margin:0;}
    h3 {color:#3a6d8c; font-size:22px; line-height:26px; font-weight:normal; margin:0 0 8px 0;}
    img {border:0;}
    #logo {margin-bottom:20px; width:300px;}
    #logo h1 {color:#666; letter-spacing:-1px; font-weight:normal;}
    #logo h1 span {color:#444; font-weight:bold;}
    #logo .title {color:#999; font-size:12px;}
    #container {margin:0 auto; padding-top:20px; width:800px;}
    #content {border-bottom:1px dotted #999; border-top:1px dotted #999; padding:20px 0;}
    #footer {clear:left; color:#888; margin:20px 0;}
    #footer a:link, #footer a:visited {color:#888; text-decoration:none;}
    #footer a:hover {color:#333; text-decoration:underline;}

  2. #2
    SitePoint Evangelist captainccs's Avatar
    Join Date
    Mar 2004
    Location
    Caracas, Venezuela
    Posts
    515
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    Try making the form wider, from the image it looks like the checkbox and the text are too wide for the container they are in. That would cause a line break.
    Denny Schlesinger
    web services

  3. #3
    SitePoint Enthusiast
    Join Date
    Oct 2012
    Location
    Republic of Ireland
    Posts
    32
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by egemen_i View Post
    i tried everything to align "checkbox" and "i agree text" which is (Kullanıcı sözlesmesini okudum kabul ediyorum) on SAME ROW but couldn't do it.
    This is really a question for the CSS section but on top of the suggestion from captainccs, I would suggest including this in your demo.css file:
    Code:
    input[type='checkbox']
    {
      float: right;
      clear: none;
    }
    
    input[for='terms_osc_box']
    {
      float: left;
      clear: none;
    }
    Also your PHP code is writing the javascript validation warning in English:
    PHP Code:
    <?php _e('It is obligatory to accept the Terms and Conditions.''terms_osc'); ?>
    Which kind of defeats the purpose while your form is in Turkish. I understand the problem because either your server or your web page may not be set to handle the UTF-8 charset. You could try setting Turkish in your javascript using '\u' plus the code of the relevant special character. You can find the codes for special characters in the Latin-1 Supplement here and Latin Extended-A including special Turkish characters here. Also make sure the charset of your web page is set to Unicode (charset="UTF-8")

    For example, replace the line above with something like this:
    PHP Code:
    <?php _e('Kullan\u0131c\u0131 s\u00F6zle\u015Fmesini okumaya ve kabul etmeye gerekiyor.''terms_osc'); ?>
    Which should print as: 'Kullanıcı sözleşmesini okumaya ve kabul etmeye gerekiyor' when your javascript file runs the warning. My apologies if the grammar is not quite right but it should give you the general idea.

    For future reference, you can also do a similar thing in strings that are set directly to the web page with PHP (in server-side validation, for instance) but use 'x' instead of 'u' before the code points.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •