Ако сте от хората, които смятате, че Facebook не е оптимизиран за съвременни компютри и лаптопи, значи тази статия е за вас. Не е удобно да ползваме стила, който ни налага FB, тъй като той е предназначен за устройства с ниска резолюция. Колкото и да е невероятно, най-популярната социална мрежа няма динамично променяща се резолюция, в зависимост от устройството на което се ползва. А това е задължителен стандарт за почти всички уеб сайтове от почти 5 години. За щастие има решение и това е в промяна на стила (CSS), използван във Facebook, така че браузъра ви да ви покаже по-добре изглеждащо съдържание. Най-популярната добавка към браузъра, това е Stylus. Можете да я изтеглите за:

Неoбходимо е да променим до известна степен ширината на цялата страница и най-вече на публикациите, а от друга – чата в месинджър, който също е абсурдно тесен и неудобен. Работата с добавката изобщо не е трудна, цъкате на иконката горе вдясно на браузъра и избирате Manage.


След това избирате вляво “Write New Style”:

Пак там горе вляво изберете име на вашия нов стил в полето “Enter a name” . Може да въведете каквото искате като име. След това вдясно в полето с мигащия курсор поставяте предварително копирания код с Paste или Ctrl+V. И накрая отново вляво горе трябва да натиснете Save. А ето го и кода (копирайте целия код):

1. За новия стил на Facebook (който не е достъпен за всички още)


/* Width of content and posting */
.oh7imozk {
width: 800px !important;
}
/*._1mj {
width: 80%;
}*/
/*Posting*/
.o0xt3n8b {
max-width: 780px;
}
/* Chat */
.esma6hys {
right: 350px;
}
.jbcpqwzg {
width: 450px;
height: 500px
}
.scwd0bx6 {
margin-bottom: 5px;
}
.nkwizq5d {
margin-right: -10px;
}
.g5o1ygfq {
margin-right: -500px;
}
/* Left and right column */
.pzfvarvs {
max-width: 350px;
}
.fer614ym {
min-width: 350px;
}
/*profile*/
.ecyo15nh {
width: 60%;
}
.o4feeg3o {
max-width: 75%;
}
.tn7ubyq0 {
width: 60%;
}
.o387gat7 {
flex-basis: 100px;
}

#facebook ._-kb div {
font-family: verdana;
}
.qmfd67dx {
max-width: 700px;
}
#sfx_badge {
left: 1300px !important;
top: 10px !important;
}
/*top bar*/
.rl25f0pe {
right: 100px;
}

Ако ви е трудно да го копирате от страницата, ето го в текстов файл за изтегляне: New Facebook

Ако използвате друга програма за промяна на CSS на страниците, то ето и кодовете, които са ви необходими.

2. За старата версия на FB за ширина на FB, за да е съвместим с Full HD резолюция:

/* Version: 0.7 */

/* page container */
._2yq #globalContainer {
width: 1212px !important;
}

/* content and right sidebar container */
._1ql0,
._2_0j {
width: 1020px !important;
}

/* content column */
._1qkx {
width: 700px !important;
}
._14iw {
left: 712px;
}

/* video container */
._5mly._40ja._45oh ._53j5 {
width: 676px !important;
}

/* simple image container */
._4-eo .uiScaledImageContainer {
width: 676px !important;
text-align: center;
}

/* all image containers but no title images */
._4-eo:not(._6k_) .uiScaledImageContainer {
height: auto !important;
}

/*border arround image */
._4-eo {
width: auto !important;
}

/* preview image links */
._6l- .uiScaledImageContainer:not([style*=”width:90px;”]):not([style*=”width:108px;”]):not([style*=”width:158px;”]):not([style*=”width:98px;”]):not([style*=”width:139px;”]), ._5inf .uiScaledImageContainer, .uiScaledImageContainer._9_m, .uiScaledImageContainer._35ph {
width: 700px !important;
height: auto !important;
}

/* user timeline field */
.fbTimelineComposerUnit.timelineUnitContainer {
width: 710px !important;
}

/* uer time content column */
._5nb8 {
width: 712px;
}

/* user page */
.timelineLayout #contentArea {
width: 1051px !important;
}

/* image in content wrapper */
._5va1 .userContentWrapper ._4-ep {
width: 650px !important;
}

/* user page header image */
._2orx {
width: 1020px !important;
}

/* user page header image */
._2orx div {
width: 1020px !important;
}
._2orx div,
._2orx img {
height: auto;
width: 1020px !important;
}

/* top bar*/
#bluebarRoot ._2t-a._4pmj._2t-d {
width: 1212px !important;
}

/* search page*/
html body._5vb_ #globalContainer {
width: 1176px;
}
._5ss8.fixed_always {
left: auto
}
html ._5vb_._5vb_.hasLeftCol .hasRightCol div#contentArea {
width: 696px !important;
}

/* search bar */
._585-{
max-width: 648px !important;
}

/* tiled image preview – just center images – enlarging not worth the work*/
._2a2q{
margin: auto;
}

/* event images */
.uiScaledImageContainer._3ojl[style*=”width:500px;”]{
width: 700px !important;
height: 362px !important;
}
.fbChatSidebar{
width:270px;
}
.uiScrollableAreaBody {
width: 100% !important;
}
#timeline_story_column {
width: 700px;
}

 

3. За оптимизиране на месинджъра:

/* Make chat popouts taller */

.fbNubFlyout > div > div > div:nth-child(2) {
height: 400px !important;
}

/* Make profile images a circle shape */

.fbNubFlyout .img {
border-radius: 300px !important;
}
BuddylistPagelet {
display: none;
}
/* Increase the width of the chat window */
._50mz.opened {
width: 454px !important;
}

._5w1r {
width: 360px !important;
max-width: 360px !important;
}
.fbNub._50mz.opened .fbDockChatTabFlyout {
right: 48px;
}