Ну наконец-то! Сегодня обнаружил, что появилась возможность получить и раздать ссылку прямо на папку (а не только на отдельные файлы в ней).
Раньше можно было получить линк лишь на отдельный файл. Или же все файлы нужно было собирать в архив и раздавать ссылку на него.
Однако всё это не очень удобно, т.к. требуются дополнительные действия со стороны пользователя. И особенно неудобно для любителей делиться фотографиями — ведь при желании показать свои фото/картинки кому-либо, нужно было получать ссылки на каждую картинку по-отдельности.
Как можно получить ссылку на папку в Яндекс Диске?Через сделать это не получится (на данный момент). Так что надо перейти в веб-интерфейс сервиса и там просто выбрать любую папку (один раз нажать на неё л.к.м) , на которую следует получить ссылку. А затем, в правом нижнем углу поставить переключатель «Публичная ссылка» в положение «вкл.»:
Теперь этот линк уже можно раздавать кому угодно. Для получателя загрузится специальный веб-интерфейс, где он сможет просмотреть содержимое папки + затем его содержимое:
Просмотр каталога
Естественно, всё это дело можно скачать сразу — одним.zip-архивом, или же «поштучно», наведя курсор на отдельный файл.
Если в каталоге имеются картинки, то при клике на любой из них запустится удобное слайд-шоу:
Слайд-шоу в Яндекс Диске (кликабельно)
С появлением возможности получить ссылку на папку в Яндекс.Диск, этот сервис по своему функционалу очень приблизился к самому — Dropbox.com. Правда, у последнего есть возможность просматривать видеоролики онлайн, но нельзя запустить онлайн mp3-аудио. У Я.Диска — всё наоборот.
Также заслуживают внимания и эти облачные сервисы:
В общем, Яндекс.Диск очень активно развивается. Кроме получения прямой ссылки на папку, в нём теперь можно прямо онлайн читать текстовые документы разных форматов (.txt, .doc, .rtf, .pdf …) и даже разархивировать архивы —
Слайд-шоу из фото или видео — это отличная возможность запечатлеть памятные моменты или сделать приятный подарок близкому человеку. Обычно для их создания используются специализированные программы или видеоредакторы, но при желании можно обратиться за помощью и к онлайн-сервисам.
В интернете имеется довольно много веб-сервисов, предоставляющих возможность создания оригинальных и качественных слайд-шоу. Правда, проблема в том, что большинство из них являются весьма ограниченными версиями приложений или предлагают свои услуги на платной основе. И все же, мы нашли парочку практичных веб-сервисов, хорошо подходящих для решения нашей задачи, о них и расскажем ниже.
Способ 1: Slide-LifeПростой в освоении и использовании онлайн-сервис, предоставляющий возможность создания слайд-шоу по одному из множества доступных шаблонов. Как и большинство подобных веб-ресурсов, Слайд-Лайф требует платы за доступ ко всем своим функциям, однако это ограничение можно обойти.
По нажатию на понравившийся вариант можно увидеть то, как будет выглядеть созданное на его основе слайд-шоу.
а затем в появившемся окне нажмите по кнопке «Выбрать фотографии» . Откроется окно системного «Проводника» , перейдите в нем в папку с нужными снимками, выделите их с помощью мышки и нажмите «Открыть» .
Сейчас самое время вспомнить об ограничениях, накладываемых бесплатной версией Slide-Life: экспортировать можно «урезанный» видеоролик, то есть с меньшим количеством слайдов, чем вы добавляли. Для того чтобы «обмануть систему», просто загрузите на онлайн-сервис больше файлов, чем планируете добавить в проект. Оптимальный вариант – создать копии тех снимков, которые будут в конце слайд-шоу, и добавить их вместе с основными. В крайнем случае лишнюю часть готового ролика можно будет обрезать.
На этой же странице можно ознакомиться с ограничениями, накладываемыми бесплатным использованием, в том числе временем ожидания готового слайд-шоу. Справа можно увидеть то, как оно будет выглядеть в выбранном шаблоне. Ссылка на скачивание проекта придет на электронную почту, которую и требуется ввести в специально отведенном поле. Указав электронный адрес, нажмите по кнопке «Сделать видео!» .
после чего останется лишь дождаться письма со ссылкой на скачивание готового слайд-шоу.
Как видите, нет ничего сложного в том, чтобы создать слайд-шоу из собственных фотоснимков и даже со своим музыкальным сопровождением на сайте Slide-Life. Недостаток данного онлайн-сервиса заключается в некоторых ограничениях бесплатной версии и отсутствии возможности редактирования всего проекта и его элемнетов.
Способ 2: KizoaЭтот онлайн-сервис предоставляет куда более широкие возможности для создания слайд-шоу в сравнении с предыдущим. Его неоспоримым плюсом является отсутствие значимых ограничений в использовании и бесплатный доступ к большинству функций. Рассмотрим, как с его помощью решить поставленную перед нами задачу.
а затем выберите вариант добавления файлов – «Мой компьютер» (помимо этого, фотографии можно загрузить и с Facebook).
Отметим, что Kizoa позволяет загружать в том числе и файлы в формате GIF. При их использовании веб-сервис предложит выбрать, как с ними поступить – создать видеоклип или оставить в качестве анимации. Для каждого из вариантов предусмотрена своя кнопка, дополнительно требуется установить галочку напротив пункта «Примените этот выбор для моей GIF скачивания» (да, разработчики сайта не блещут грамотностью).
При добавлении первого снимка в будущее слайд-шоу нажмите «Да» во всплывающем окне.
При желании, сразу после подтверждения можно определиться с типом переходов между слайдами. Однако лучше пропустить этот момент, так как следующий шаг предоставляет возможность более детальной обработки.
Выберите подходящий эффект перехода из большого списка доступных и поместите его между слайдами – в область, обозначенную буквой «Т» .
Выберите подходящий эффект и перетяните его на слайд.
В появившемся всплывающем окне можно увидеть, как отразится выбранный вами эффект на конкретном изображении. Для его применения нажмите по небольшой кнопке «Утвердить» ,
а затем по еще одной такой же.
Выберите подходящий шаблон и поместите его на изображение.
Во всплывающем окне введите желаемую надпись, выберите подходящий шрифт, цвет и размер.
Для добавления надписи на изображение дважды нажмите «Утвердить» .
На выбор доступно два варианта – мелодия из внутренней библиотеки, которую нужно выбрать и поместить на отдельную дорожку, или загруженная с компьютера. Для добавления собственной композиции нажмите расположенную слева кнопку «Добавить мою музыку» , перейдите в нужную папку в открывшемся окне «Проводника» , выберите песню, выделите ее и нажмите «Открыть» .
Подтвердите свои намерения, нажав «Выбрать для создания слайд-шоу» во всплывающем окне.
Затем, как и с мелодиями из собственной базы онлайн-сервиса, выделите добавленную аудиозапись и переместите ее на слайд-шоу.
В открывшемся окне плеера можно просмотреть готовый проект и выбрать вариант его экспорта. Для сохранения слайд-шоу на компьютер в качестве видеоролика нажмите по кнопке «Скачать» .
Закройте следующее всплывающее окно или кликните по кнопке «Выйти» для перехода к скачиванию файла.
Нажмите «Скачать ваш фильм» ,
после чего в «Проводнике» укажите папку для сохранения готового слайд-шоу и нажмите «Сохранить» .
Онлайн-сервис Kizoa во многом превосходит Slide-Life, так как позволяет самостоятельно обрабатывать и изменять каждый элемент создаваемого слайд-шоу. К тому же, ограничения его бесплатной версии никоим образом не отразятся на обычном, небольшом проекте.
Доброго времени суток, друзья. Интересное решение для при клике на иконку, которая не будет раздражать посетителей. В нём вы сможете разместить или важные объявления, или другую нужную информацию. Оно появиться только тогда, когда пользователь нажмёт на иконку (в моём случае иконка андроид).
Код абсолютно не сложный, без всяких библиотек и тяжёлых скриптов. И устанавливается элементарно в гаджет HTML/JavaScript. Сама картинка и кнопка "закрыть" в svg формате. Наглядно посмотреть эту "конструкцию" можно на тестовом блоге в правом верхнем углу.
Демонстрация
Приветствую, Вас
блог
шпаргалки блогерши
о создании, настройках, оформлении и ведении блога на платформе BLOGGER
Надеюсь, что Вы найдёте здесь много полезной и интересной информации. Очень буду рада вашим отзывам
.app-android-outer {
width: 50px;
position: fixed;
top: 0;
right: 50px;
z-index: 9999
}
.app-android {
width: 50px;
height: 55px;
line-height: 55px;
margin: 0;
text-align: center;
position: relative;
float: right;
cursor: pointer
}
.app-android svg {
vertical-align: middle;
opacity: .7
}
.app-android:hover svg,
.app-android:focus svg,
.app-android:active svg {
opacity: 1
}
.app-android:before {
content: "";
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0
}
.app-content {
background: #fff url(https://2.bp.blogspot.com/-sSuAXU_yhVM/XPD3sxcQ8DI/AAAAAAABK4s/CusSSD-sJf8k_B6AuUkF4g5nkmivM6MEACLcBGAs/s300-rw/android-4.png
) no-repeat bottom left;
width: 300px;
padding: 0;
border: 1px solid #ccc;
border-color: rgba(0, 0, 0, .2);
line-height: 1.3;
-webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, .2);
box-shadow: 0 2px 10px rgba(0, 0, 0, .2);
outline: 0;
position: absolute;
right: 50%;
top: 50px;
margin-right: -40px;
-webkit-border-radius: 2px;
border-radius: 2px;
-webkit-user-select: text;
z-index: 2;
display: none;
}
.app-content h3 {
margin: 0;
padding: 5px 20px;
color: #333;
font-size: 18px;
font-weight: 700;
border-bottom: 1px solid #ccc;
border-color: rgba(0, 0, 0, .2)
}
.app-content-on {
padding: 10px 20px 16px;
color: #333;
font-size: 16px;
font-weight: 400
}
.app-content-on svg {
vertical-align: -7px;
}
.app-content:before {
content: "";
border-color: transparent;
position: absolute;
right: 0;
margin-right: 30px;
z-index: 1;
height: 0;
width: 0;
border-bottom-color: #ccc;
border-bottom-color: rgba(0, 0, 0, .2);
top: -9.5px
}
.app-content:after {
content: "";
border-color: transparent;
border-bottom-color: #fff;
border-style: dashed dashed solid;
border-width: 0 8.5px 8.5px;
position: absolute;
right: 0;
margin-right: 30px;
top: -8.5px;
z-index: 1;
height: 0;
width: 0
}
.app-close-button {
position: absolute;
width: 18px;
height: 18px;
line-height: 28px;
text-align: center;
top: 7px;
right: 5px;
background: 0 0;
border: none;
cursor: pointer;
padding: 0
}
.app-close-button:before {
content: "";
position: absolute;
top: -15px;
right: -15px;
bottom: -15px;
left: -15px;
cursor: pointer
}
.slideInUp {
-webkit-animation-name: slideInUp;
animation-name: slideInUp;
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both
}
@-webkit-keyframes slideInUp {
0% {
visibility: visible
}
100% {
transform: translateY(0)
}
}
@keyframes slideInUp {
0% {
-webkit-transform: translateY(100%);
transform: translateY(100%);
visibility: visible
}
100% {
-webkit-transform: translateY(0);
transform: translateY(0)
}
}
@media screen and (max-width:960px) {
.app-android-outer {
right: 80px
}
}
@media screen and (max-width:375px) {
.app-content {
margin-right: -75px
}
.app-content:after,
.app-content:before {
margin-right: 65px
}
}
@media screen and (max-width:320px) {
.app-content {
margin-right: -95px
}
.app-content:after,
.app-content:before {
margin-right: 85px
}
}
Копируйте готовый код целиком, устанавливайте его в гаджет HTML/JavaScript в любое место макета блога. Иконка будет расположена именно в том месте, как задумано. В строке, отмеченной серым цветом, полупрозрачная фоновая картинка самого всплывающего окна. За ненадобностью можно убрать из кода и задать предпочтительный основной фон на свой вкус, изменив значение background: #fff
на желаемое.
Спасибо всем за внимание. Увидимся.
оформите подписку на новые шпаргалки
Привет, друзья. Хочу показать как очень просто изменить общий фон всего блога. Хотя сам фон можно легко настроить в разделе Тема . Там можно подобрать готовые фоны или залить свою картинку и сделать соответствующие настройки. Однако, решила вам предложить более лёгкий вариант, на мой взгляд. Здесь мы сами сможем регулировать размер фоновой картинки. Вернее её ширину.
Перейдём к делу. Изначально мой тестовый блог выглядел так. Я отметила пространство (или задний фон всего полотна), который задан был в настройках темы.
Сейчас мы его поменяем на такую картинку
Чтобы получилось примерно вот так
Здесь я хочу обратить ваше внимание. Ширина блога в моём случае 1200 px. Размеры фоновой картинки 1450 на 950 px. Картинка заполнила полностью всё пространство.
Если размеры фоновой картинки будут меньше размера всего полотна блога, то она не закроет всё пространство и будет выглядеть в виде бордюра. Посмотрите разницу
Оно, вроде как, тоже вполне приемлемо. Некоторые таким образом украшают сайты к праздникам. В любом случае рассмотрим оба варианта. При правильно подобранном или созданном в любом редакторе фоне и тот и другой вариант можно подогнать.
Особых навыков не нужно.
1. Подберите нужную картинку и скопируйте её адрес.
2.Копируйте приведённый ниже код и устанавливаете адрес своей картинки
3. Идём во вкладку Тема - Изменить HTML находим ]]> и устанавливаем над этой строкой готовый код.
Результат будет виден при просмотре темы. Если вы остались им довольны смело нажимайте сохранить и любуйтесь новым шаблоном.
Опять же повторюсь. На тот случай если картинка оказалась меньше размеров ширины блога или вообще спряталась с глаз долой, нужно в коде задать значение ширины. Добавим всего одну строчку и он выглядел так
body {
background: url(http://www.clipartbest.com/cliparts/9iz/EnR/9izEnR56T.png)
no-repeat top fixed ;
background-size: 100%;
}
Такими простыми манипуляциями можно создавать разные фоны под разные праздники, времена года или ваше настроение.
Возможно Вы пропустили
Всем добра и до встречи.
Привет, всем. Сегодня предложу вам код, когда при наведении на ссылку появляется картинка. Вариантов оформления ссылок достаточно много. Но этот будет оригинальным решением для тематических блогов. Или же для оформления отдельного сообщения. Картинку всегда можно подобрать под нужную тематику и дизайн.
Вот сам код.
Дорогие читатели "текст ссылки", Поздравляю вас с наступающим 2020 годомтекст ссылки. Пусть начнется новым взлетом К лучшим жизненным высотам И хорошим в банке счетом текст ссылки Принесет в делах согласье, В личной жизни — много счастья!."
.stage {
display: table-cell;
vertical-align: middle;
}
.tabled, .middled {
text-align: center;
margin: 0 auto;
}
.jumbo {
font-size: 150%;
vertical-align: -25px;
transform: rotate(8deg);
}
.jumbo:first-child {
-webkit-animation: wave 10s infinite ease;
animation: wave 10s infinite ease;
}
.jumbo:last-child {
-webkit-animation: wave 15s infinite ease;
animation: wave 15s infinite ease;
}
@keyframes wave {
0% { transform: rotate(8deg); }
25% { transform: rotate(15deg); }
75% { transform: rotate(-10deg); }
100% { transform: rotate(8deg); }
}
@-webkit-keyframes wave {
0% { -webkit-transform: rotate(0deg); }
50% { -webkit-transform: rotate(10deg); }
100% { -webkit-transform: rotate(0deg); }
}
p {
font-size: 110%;
font-family: Helvetica, sans;
max-width: 24em;
margin: 0 auto;
text-align: justify;
color: #00695C;
font-weight: lighter;
line-height: 1.5em;
}
a {
color: #ccc;
text-decoration: none;
border-bottom: solid thin #f7901d;
}
a:hover {
color: #f7901d;
}
.boo {
position: relative;
}
.boo:before, .boo:after {
position: absolute;
transition: all 0.15s ease;
}
.boo:before {
top: -75px;
left: -70px;
-webkit-transform:rotate(0deg) scale(0);
-moz-transform:rotate(0deg) scale(0);
-o-transform:rotate(0deg) scale(0);
-ms-transform:rotate(0deg) scale(0);
transform:rotate(0deg) scale(0);
}
.boo:after {
top: -115px;
right: -70px;
-webkit-transition-delay: 0.05s;
transition-delay: 0.05s;
-webkit-transform:rotateY(180deg) scale(0);
-moz-transform:rotateY(180deg) scale(0);
-o-transform:rotateY(180deg) scale(0);
-ms-transform:rotateY(180deg) scale(0);
transform:rotateY(180deg) scale(0);
}
.boo:hover:before {
top: -140px;
-webkit-transform:rotate(15deg) scale(1);
-moz-transform:rotate(15deg) scale(1);
-o-transform:rotate(15deg) scale(1);
-ms-transform:rotate(15deg) scale(1);
transform:rotate(15deg) scale(1);
}
.boo:hover:after {
-webkit-transform:rotateY(180deg) scale(0.7);
-moz-transform:rotateY(180deg) scale(0.7);
-o-transform:rotateY(180deg) scale(0.7);
-ms-transform:rotateY(180deg) scale(0.7);
transform:rotateY(180deg) scale(0.7);
}
.boo:before, .boo:after {
content: url("ссылка на картинку. png");
}
Скопируйте код целиком, сделайте нужные настройки и установите его в редакторе сообщения в режиме HTML в нужном месте. В примере указаны 3 ссылки. В любом случае можно убирать или добавлять строку такого вида
"текст ссылки")
А мне от всего сердца хочется вам всем пожелать самого счастливого Нового года. Улыбок, радости, здоровья, благополучия родным и близким. Добра и мира Вашему дому!!!
С НАСТУПАЮЩИМ, ВСЕХ, НОВЫМ 2020 ГОДОМ!!!
Всем, привет. Навигация в стандартных шаблонах Блоггер вообще не привлекает к себе никакого внимания. Еле заметная панелька в конце страницы не каждый и заметит. Поэтому любой новый посетитель может не увидеть ссылку на предыдущие или следующие статьи блога.
Стилей навигации достаточно много. Но уже не первый раз обращаются, что многие из них "приказали долго жить". А навигация сайта, пожалуй самый основной элемент. Поэтому дам ссылки на статьи, где публиковала уже варианты оформления навигации и предложу ещё один рабочий код. Вот так она будет выглядеть под сообщениями блога.
Сегодняшний вариант смотрится достаточно элегантно. Отображает на панели нумерованный список страниц и правильно отображает предыдущие и следующие.
//1J "+i+\" 1H \"+g+"";7 1f=L(i)-1;5(i>1){5(i==2){5(l=="s"){6+=\"\"+Q+\"\"}e{6+=\"\"+Q+\"\"}}e{5(l=="s"){6+=\"\"+Q+\"\"}e{6+=\"\"+Q+\"\"}}}5(E>1){5(l=="s"){6+=\"1\"}e{6+=\"1\"}}5(E>2){6+=\"...\"}1m(7 m=E;m
