Единый форум поддержки

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.


Вы здесь » Единый форум поддержки » Коллективная работа » Тема для обсуждений: Мобильная версия форума


Тема для обсуждений: Мобильная версия форума

Сообщений 1 страница 20 из 49

1

В этой теме обсуждаем мобильную версию форумов. Основная тема: Мобильная версия форума


Возможно ли это в скором будущем?

Или подключение форумов к системам Tapatalk и Forum Runner для iOS?
http://itunes.apple.com/us/app/forum-ru … 27234?mt=8

Или создание собственного приложения (конвертера форумов), куда за деньги можно будет внести свой форум в каталог? Думаю, многие бы покупали этот апп. Время домашнего интернета уходит, юзеры становятся всё более мобильными.

Отредактировано Finka (Вт, 19 Июн 2012 07:01:29)

0

2

Упс. Не в тот раздел запостила. Модераторы, перенесите тему, пожалуйста >>>Ссылка

Отредактировано Finka (Вт, 19 Июн 2012 07:51:42)

0

3

Finka написал(а):

Мобильная версия форумов

Если я ничего не путаю, можно реализовать облегчённую версию форума через CSS Media Types.

0

4

rps написал(а):

Если я ничего не путаю, можно реализовать облегчённую версию форума через

Да, Герда уже делала

0

5

rps написал(а):

Если я ничего не путаю, можно реализовать облегчённую версию форума через CSS Media Types.

А какой type указать для мобильных приложений из перечисленного?

all Все типы. Это значение используется по умолчанию.
aural Речевые синтезаторы, а также программы для воспроизведения текста вслух. Сюда, например, можно отнести речевые браузеры.
braille Устройства, основанные на системе Брайля, которые предназначены для слепых людей.
handheld Наладонные компьютеры и аналогичные им аппараты.
print Печатающие устройства вроде принтера.
projection Проектор.
screen Экран монитора.
tv Телевизор.

handheld?

то есть нужно сделать так?

Код:
@media handheld
  {
  p.test {font-family:verdana,sans-serif;font-size:14px;}
  }

А вставлять куда?

0

6

Deff написал(а):

Да, Герда уже делала

а где найти можно?

0

7

Просмотрела форум Герды, да, офигенно получилось! :cool:  :cool:  :cool:  http://mybb.ru/f/collection/0211.gif
Особенно понравились вертикальные и горизонтальные версии, в одной из-за размеров аватарки не показываются, только ник, а в другой показываются. Я так понимаю это зависит от выставленных размеров разрешения?

А Герда поделится секретом? Я в этом совсем плохо разбираюсь, а мобильная версия необходима. У меня юзеры с работы вынуждены сидеть на форуме с мобилок, с компов доступ перекрыт :D

0

8

Deff написал(а):

Да, Герда уже делала

Эта идея уже давно здесь крутится, я вчера специально консультировался по этому вопросу - плохо определяются мобильные телефоны старых моделей. Все новые устройства - без проблем, а вот если кто со старого зайдёт - могут возникнуть проблемы.

0

9

Нужно подправить пару вещей.
Например, вот здесь сайдбар при сжимании отправляется вниз. Как мне сделать это со своим сайдбаром? http://vsemilye.rolebb.com/

Отредактировано Finka (Чт, 16 Авг 2012 06:07:14)

0

10

Finka
Он тогда должон быть прописан  не таблицей, а <div c float:right
Очевидно нужно его, при таком раскладе, впихивать скриптом после #pun-main

Отредактировано Deff (Чт, 21 Июн 2012 03:10:56)

0

11

Deff

Код:
<div id=Inf_block_Right style="display:none">
<h2>Чат Кукубикл</h2>
 <center><a href="http://cucubicle.chatovod.ru/widget/" target="_blank"><img style="" src="http://vsemilye.rolebb.com/uploads/000f/59/02/341-2.png"title="Чат Кукубикл" alt="" /></a><br>В чате сейчас:<br><br>

<script type="text/javascript" language="JavaScript" src="http://api.chatovod.ru/call?chatname=cucubicle&method=getOnlineUsersByChat&retvar=onlineUsers"></script>
<script type="text/javascript" language="JavaScript">
  for(var i=0;i<onlineUsers.length;i++) {
    if (i != 0) document.write(", ");
    var u = onlineUsers[i];
    document.write(u.nick.replace(/&/gi, "&amp;").replace(/</gi, "&lt;").replace(/>/gi, "&gt;"));
  }
</script> </center><br>

  <h2>Сыыыр!</h2>
    <center><a href="http://ruseller.com/adds/adds1993/example/" target="_blank"><img style="" src="uploads/000f/14/29/13414-1.png" alt="" /></a><br><br>Сделай фотографию на лету и помести её в <a href="http://vsemilye.rolebb.com/viewtopic.php?id=112#p819" target="_blank">Фотосалоне</a><br><br></center>
</div>



</div>

    <script type="text/javascript">
    var L=$("#Inf_block_Left").html();$("#Inf_block_Left").replaceWith("");
    var R=$("#Inf_block_Right").html();$("#Inf_block_Right").replaceWith("");
    if($(".punbb").attr("id")=="pun-index"){

      var LeftSUM='', RightSUM='',block1='<div class="container" style="padding:5px;" id=News_';
      var block2="</div><br><br>";
    if(L!=null){ var c = L.split(/<h2>|<\/h2>/igm);
    for(i=1; i<c.length; i+=2){
    LeftSUM+=block1+'L'+(i+1)/2+' >'+'<h2><center>'+c[i]+'</center></h2>'+c[i+1]+block2;
    }LeftSUM='<td id=LeftNews width=21% valign=top>'+LeftSUM+'</td>';/*alert(LeftSUM);*/}
    if(R!=null){ var c = R.split(/<h2>|<\/h2>/igm);
    for(i=1; i<c.length; i+=2){
    RightSUM+=block1+'R'+(i+1)/2+' >'+'<h2><center>'+c[i]+'</center></h2>'+c[i+1]+block2;
    }RightSUM='<td id=RightNews width=15% valign=top>'+RightSUM+'</td>';/*alert(RightSUM);*/}

      if(LeftSUM!='' || RightSUM!=''){ $("#pun-main").html('<table width=100% id="NEWS"><tr>'+LeftSUM+'<td>'+$("#pun-main").html()+'</td>'+RightSUM+'</tr></table>'); };}
    </script>

Что мне тут нужно изменить? :smoke:

0

12

Finka
тут можно подробнее посмотреть о MQ - http://habrahabr.ru/post/119127/

схема такая:

@media screen and (max-width: 480px) {
тут коды css под мобильный дисплей
    }

красное - ширина экранчика
например....
было:

#pun {
    border: medium none;
    margin: 0 auto 30px;
    padding: 0 21px;
    width: 884px;
}

#pun-ulinks .container {
    border: medium none;
    font-weight: bold;
    height: 35px;
    padding-top: 18px;

    text-align: center;
}


стало:

@media screen and (max-width: 480px) {
#pun {
    width: 90%;
}
#pun-ulinks .container {
    height: auto;
    padding: 5px;

}
    }

http://s1.uploads.ru/t/A/D/x/ADxdr.jpg

смотришь свой форум при другом разрешении, ищешь баги и исправляешь

Отредактировано Герда (Чт, 21 Июн 2012 06:07:00)

0

13

Герда
Спасибо! http://mybb.ru/f/collection/0211.gif
Буду разбираться.

0

14

Чёто у меня ничего не получается. Всё съезжает и форум "плавает" на мобилке.

Мне в принципе нужно изменить всего несколько вещей:
1. Чтобы профиль в посте отображался не вертикално, а горизонтально, вот так
http://a2.mzstatic.com/us/r1000/060/Purple/v4/aa/ce/60/aace6071-b768-e5b2-1d5c-4d1a2238f331/mzl.ksaaidyv.320x480-75.jpg

2. Фонт покрупнее.

3. Чтобы список тем отображался вот так
http://s011.radikal.ru/i315/1110/cd/031a5a283696.jpg

0

15

Finka написал(а):

1. Чтобы профиль в посте отображался не вертикално,

Ну чо нидь типо так , но нужен спойлер на инфу , чтобы остальную инфу сделать правее аввы  - а не уходящей под обрез

<style type="text/css">
.punbb .post .post-author ul,
.punbb .post .post-author {
float: none;
height:200px;
width: 100%!important;
}
.punbb .post-body {
margin-left: 0;
}
</style>

0

16

Или вот так.
Список категорий

Свернутый текст

http://s1.uploads.ru/i/v/O/7/vO7Hk.jpg

Список тем в категориях

Свернутый текст

http://s1.uploads.ru/i/B/j/x/BjxsT.jpg

Посты в темах. Там, где имя автора можно приделать маленькую аватарку.

Свернутый текст

http://s1.uploads.ru/i/a/W/D/aWDLH.jpg

0

17

Deff написал(а):

Ну чо нидь типо так , но нужен спойлер на инфу , чтобы остальную инфу сделать правее аввы  - а не уходящей под обрез

Да, что-то вроде этого. Но можно и без спойлера. Просто ник и дата поста, самая облегчённая версия. Для этого нужно выставить запрет вывода? Вот так?

Код:
.post-author ul li.pa-avatar {display:none;}

0

18

Надо попробовать самому написать...

0

19

rps
http://forum.mybb.ru/img/avatars/0000/14/1c/14907-1265982382.gif

0

20

Можно вывести аватар, ник, дату и время добавления поста в одну горизонтальную черту, inline?
примерно как здесь

http://s1.uploads.ru/i/0KkTG.jpg
http://s1.uploads.ru/i/BICfH.jpg

Отредактировано Finka (Пт, 29 Июн 2012 13:39:24)

0


Вы здесь » Единый форум поддержки » Коллективная работа » Тема для обсуждений: Мобильная версия форума