Блог

Как разрешить моим пользователям загружать изображение, которое загружено в моем сообщении в блоге?

Функция щелчка правой кнопкой мыши на странице отключена. Таким образом, пользователь не может загрузить, щелкнув правой кнопкой мыши.

Я хотел бы создать ссылку или кнопку, такую как

 <a class="btnlink4" href="#">Download this Image.</a>
  

Обычно в моих сообщениях в блоге есть только одно изображение.

Для изображений, загруженных в сам Blogger, добавление параметра запроса ?dl=1 в конце URL-адреса изображения приведет к принудительной загрузке. Другой способ сделать это — добавить суффикс -d после параметра sizing в URL-адресе изображения (он же s1600 ), например —

 <a href="https://1.bp.blogspot.com/-k1bwGQauV6I/WLyURMAuU9I/AAAAAAAAAD0/k_ZcX4sr_bENoB2P3P8MTEfN-ymfa3_ugCLcB/s1600/en_Contempo.jpg?dl=1">Download this Image.</a>

<a href="https://1.bp.blogspot.com/-k1bwGQauV6I/WLyURMAuU9I/AAAAAAAAAD0/k_ZcX4sr_bENoB2P3P8MTEfN-ymfa3_ugCLcB/s1600-d/en_Contempo.jpg">Download this Image.</a>  

Вы можете использовать download свойство href атрибута anchor тега. Это загрузит изображение. Во-первых, когда вы загружаете изображение, вы получаете ссылку, по которой оно загружается, примерно так:

 <div class="separator" style="clear: both; text-align: center;">
    <a href="https://3.bp.blogspot.com/-GfBiEDZvfKo/W9iND3nZniI/AAAAAAAAASY/ZEo4RIBwDkQBOQsEPecPZJ9pBQDiqOdcgCPcBGAYYCw/s1600/Google+AdSense.jpg" imageanchor="1" style="clear: right; float: right; margin-bottom: 1em; margin-left: 1em;">
        <img border="0" data-original-height="161" data-original-width="293" height="174" src="https://3.bp.blogspot.com/-GfBiEDZvfKo/W9iND3nZniI/AAAAAAAAASY/ZEo4RIBwDkQBOQsEPecPZJ9pBQDiqOdcgCPcBGAYYCw/s320/Google+AdSense.jpg" width="320" />
    </a>
</div>
  

Что вам нужно сделать, так это добавить слово download в конце тега привязки к URL-адресу изображения, поскольку оно href выглядит следующим образом:

 <a href="IMAGE-URL" download>Download Image</a>
                    ^^^^^^^^
  

Пример здесь:

 This is the image:
<div class="separator" style="clear: both; text-align: center;">
    <a href="https://3.bp.blogspot.com/-GfBiEDZvfKo/W9iND3nZniI/AAAAAAAAASY/ZEo4RIBwDkQBOQsEPecPZJ9pBQDiqOdcgCPcBGAYYCw/s1600/Google+AdSense.jpg" imageanchor="1" style="clear: right; margin-bottom: 1em; margin-left: 1em;">
        <img height="174" src="https://3.bp.blogspot.com/-GfBiEDZvfKo/W9iND3nZniI/AAAAAAAAASY/ZEo4RIBwDkQBOQsEPecPZJ9pBQDiqOdcgCPcBGAYYCw/s320/Google+AdSense.jpg" width="320" />
    </a>
</div>

Download link
<a href="https://3.bp.blogspot.com/-GfBiEDZvfKo/W9iND3nZniI/AAAAAAAAASY/ZEo4RIBwDkQBOQsEPecPZJ9pBQDiqOdcgCPcBGAYYCw/s320/Google+AdSense.jpg" download>Click here to download it</a>