Pay money and get answers for your WordPress questions (more info)

align the site to the right

  • REFUND REQUESTED

Hi,

This site needs to be localized to Hebrew. Meaning, appearance from right to left.

1. Change the menu navigation to the right.
2. The text titles/headers on each page/post should be aligned to the right.
3. Blog page aligned to the right (http://www.personal-fitness.co.il/%D7%91%D7%9C%D7%95%D7%92/)
4. Contact page - align text to the right. Flip between the map and the form in this page.

http://www.personal-fitness.co.il/

Thanks,
Sharon

Answers (2)

2013-01-27

Naveen Chand answers:

1. Change the menu navigation to the right.


Step 1: Add this to your css file:

.mainmenu > ul > li, .mainmenu > .menu > ul > li {
float: right;
}


</code>

Step 2: Change margin right from 40px to 140px by finding this code in your css.

.mainmenu ul {
list-style-type: none;
margin: 0 45px 0 0; //Change 45px to 140px in this line
font-weight: bold;
}


Naveen Chand comments:


4. Contact page - align text to the right. Flip between the map and the form in this page.

Add this to your style.css file:

.onecolumn .sc-column.one-half, .onecolumn .sc-column.one-half-last {
width: 448px;
float: right;
}


Naveen Chand comments:


2. The text titles/headers on each page/post should be aligned to the right.
3. Blog page aligned to the right (http://www.personal-fitness.co.il/%D7%91%D7%9C%D7%95%D7%92/)

To handle both the above, you need to selectively use this css property wherever you want:


text-align:right


And then, in blog page you may have to also make this change: Change the float from left to right.


.hentry .entry-header {
position: relative;
margin-bottom: 10px;
float: left; // change this to "right"
margin-right: 24px;
}


cloudnclear comments:

Hi,
Thank you.

1. The menu navigation is "on" the phone number. How do I move the phone number to the left side?
2. the "text-align:right" - where exactly should I insert it? sorry, I didn't get it. If I change all locations to "text-align:right" would that solve the problem?
3. The blog is still alinged to the left.
4. The Headers in each page are still aligned to the left.
5. The contact form fields should also be align to the right.

Sharon


Naveen Chand comments:

1. The menu navigation is "on" the phone number. How do I move the phone number to the left side?

Did you follow Step 2 in my first response. You need to change the margin in the css as below:


.mainmenu ul {

list-style-type: none;

margin: 0 140px 0 0; //Change 45px to 140px in this line

font-weight: bold;

}


2. the "text-align:right" - where exactly should I insert it? sorry, I didn't get it. If I change all locations to "text-align:right" would that solve the problem?

Like I said you need to selectively use this. For example, add this to your css file and check your blog page:

#content {
text-align: right;
}

Why I am saying selectively is because, if you simply add the code I give you it may have affect all the pages. If you want all pages to align to right, then use the above code and it would solve your problem.

3. The blog is still alinged to the left.
Try to insert the above code.

4. The Headers in each page are still aligned to the left.
Headers... do you mean site title? or page title?

If it is site title, add this css..

#header .logo {
float: right;
}


Page title will move to right if you add the code I gave in the above point 1.

5. The contact form fields should also be align to the right.
You can share access to me so I can help with you this as well as all the above. Send a Personal Message or skype at knaveenchand

Thanks.


Naveen Chand comments:

Hi,

Thanks for sending the PM. For fixing the contact form, insert this css in your stylesheet:

.wpcf7 p {
float: right;
}


cloudnclear comments:

Nothing is changing..

2013-01-27

Abdelhadi Touil answers:

Hi.
I'am an Arabic web designer, so I know exactly what you want because my language is also from right to left like yours :)
For me, to convert a theme to be rtl I first add the dir="rtl" tag to <html> tag in the header, then I use this very helpful tool:

[[LINK href="http://cssjanus.commoner.com/"]]http://cssjanus.commoner.com/[[/LINK]]

just copy your style code (from style.css file) and paste it in the tool then click on Run CSSJanus, so you'll get the rtl code automaticly, you copy it from the tool and replace the code in style.css file. (I recomend you to save a copy of original style.css file).
You can send me your theme and I'll convert it for you if you can't do it yourself.
Good luck.