The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

Text box and smiley box

2 posters

Go down

Solved Text box and smiley box

Post by kumotta April 11th 2014, 1:37 am

hello  Hello 

I just get an idea about the layout, I hope someone can make it realized.

This is the default view in my forum posts;


Text box and smiley box Postin10



and I want to change it to be like this (i'm using photoshop  Razz )


Text box and smiley box Postin11



Can I make it like that? can anybody help me?  :rose:
kumotta
kumotta
Forumember

Female Posts : 204
Reputation : 3
Language : English

http://komiku.forumid.net/

Back to top Go down

Solved Re: Text box and smiley box

Post by Ange Tuteur April 11th 2014, 1:43 am

Hello kumotta,

You should probably by able to adjust the smiley box size by this CSS :
Code:
#smiley-box { width:30%; }
.posting-block { margin-left:-15%; }

You would need to decrease the left margin on the post block so the smiley box will not go to the next line. You may need to adjust the values above for your forum.
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: Text box and smiley box

Post by kumotta April 11th 2014, 1:54 am

Text box and smiley box Postin13

hello,

how to make title box same width to the text box? and one more, can i removed box of view more emoticon? thank you~  Wink
kumotta
kumotta
Forumember

Female Posts : 204
Reputation : 3
Language : English

http://komiku.forumid.net/

Back to top Go down

Solved Re: Text box and smiley box

Post by Ange Tuteur April 11th 2014, 2:05 am

Use this CSS to hide the smiles catgeory :
Code:
#smilies_categ { display:none; }

Use this CSS to adjust the title position and size :
Code:
fieldset.frm-set.multi dl dd.frm-input { margin-left:0; }
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: Text box and smiley box

Post by kumotta April 11th 2014, 2:22 am

Text box and smiley box Postin14

still less fit  :/ 

I want to look like this;


Text box and smiley box Postin15
kumotta
kumotta
Forumember

Female Posts : 204
Reputation : 3
Language : English

http://komiku.forumid.net/

Back to top Go down

Solved Re: Text box and smiley box

Post by Ange Tuteur April 11th 2014, 2:30 am

Add to the left margin by percent or pixel, and adjust the input field width also :
Code:
fieldset.frm-set.multi dl dd.frm-input {
    margin-left:3%;
    width:50%;
}
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: Text box and smiley box

Post by kumotta April 11th 2014, 2:46 am

okay, all look fine now  Wink 
but, please one more problem  :rose: 
how to add title box emoticon in here?

Text box and smiley box Postin16
kumotta
kumotta
Forumember

Female Posts : 204
Reputation : 3
Language : English

http://komiku.forumid.net/

Back to top Go down

Solved Re: Text box and smiley box

Post by Ange Tuteur April 11th 2014, 4:04 am

Go to Administration panel > display > templates > post and private messages > posting_body

Find :
Code:
<div id="smiley-box">
 <div id="smileyContainer">
 {L_SMILIES_PREVIEW_NEW}
 </div>
 </div>

Replace by :
Code:
<div id="smiley-box">
                        <div id="emoj_head">Emoticon</div>
 <div id="smileyContainer">
 {L_SMILIES_PREVIEW_NEW}
 </div>
 </div>

Save and publish.

Then add CSS to customize :
Display > Colors > CSS stylesheet
Code:
#emoj_head {
    color:#0AC;
    font-size:16px;
    text-align:center;
    border:1px solid #CCC;
    padding:3px;
}
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: Text box and smiley box

Post by kumotta April 11th 2014, 9:48 pm

hello ange,

this part, i have little problem  
Can you tell me the code to set the height post box and move the reason box?  thank you :rose: 

Text box and smiley box Postin17
kumotta
kumotta
Forumember

Female Posts : 204
Reputation : 3
Language : English

http://komiku.forumid.net/

Back to top Go down

Solved Re: Text box and smiley box

Post by Ange Tuteur April 12th 2014, 3:51 am

Use this CSS to adjust the SCEditor height :
Code:
.frm-textarea .sceditor-container { height:250px !important; }

Use this CSS to move the reason for editing :
Code:
div#textarea_content.posting-block br + dl { margin-left:10%; }
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Solved Re: Text box and smiley box

Post by kumotta April 13th 2014, 11:56 am

i think to this topic is solved, thanks ange  :rose:
kumotta
kumotta
Forumember

Female Posts : 204
Reputation : 3
Language : English

http://komiku.forumid.net/

Back to top Go down

Solved Re: Text box and smiley box

Post by Ange Tuteur April 13th 2014, 12:19 pm

You're welcome I love you

Topic solved and archived
Ange Tuteur
Ange Tuteur
Forumaster

Male Posts : 13246
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania

https://fmdesign.forumotion.com

Back to top Go down

Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum