Giter Club home page Giter Club logo

hexo-theme-landscape's Introduction

Landscape

NPM version

A brand new default theme for Hexo.

Installation

Install

If you're using Hexo 5.0 or later, the simplest way to install is through npm:

npm i hexo-theme-landscape

Install via git:

git clone --depth 1 https://github.com/hexojs/hexo-theme-landscape themes/landscape

If you would like to enable the RSS, the hexo-generator-feed plugin is also required.

Enable

Modify theme setting in _config.yml to landscape.

_config.yml
- theme: some-theme
+ theme: landscape

Update

Install the latest version through npm:

npm install hexo-theme-landscape@latest

Or update to the latest master branch via git:

cd themes/landscape
git pull

Configuration

The configuration file for the theme is _config.yml in the repository. As the default theme for Hexo, hexo-theme-landscape is installed via npm during the hexo init site creation process, so it is generally located in the node_modules/hexo-theme-landscape directory. If you install it via git clone or other methods, it might be located in the themes/landscape directory.

It is important to note that to prevent your modifications to the theme configuration file from being lost or overwritten during theme upgrades, we do not recommend directly modifying this default configuration file. You can copy the theme's _config.yml to your blog's root directory as _config.landscape.yml and configure it according to the documentation of configuration options therein (see Alternate Theme Config).

The following will also detail the usage of some options.

Features

FancyBox

Landscape uses Fancybox to showcase your photos. You can use Markdown syntax or fancybox tag plugin to add your photos.

![img caption](img url)

{% fancybox img_url [img_thumbnail] [img_caption] %}

Sidebar

You can put your sidebar in left side, right side or bottom of your site by editing sidebar setting.

Landscape provides 5 built-in widgets:

  • category
  • tag
  • tagcloud
  • archives
  • recent_posts

All of them are enabled by default. You can edit them in widget setting.

Header links

You can add links to the header area with icons.

links:
  github: https://github.com/your_github_account
  twitter: https://twitter.com/your_twitter_account
  telegram: https://t.me/your_telegram_account

hexo-theme-landscape's People

Contributors

44uk avatar curbengh avatar dependabot-preview[bot] avatar dependabot[bot] avatar foolyoghurt avatar giuseppelt avatar gologo13 avatar ideoplex avatar jlhwung avatar kuanyui avatar leesei avatar lulzneko avatar mlapointe avatar nakorndev avatar noahdragon avatar rammusxu avatar sanori avatar stevenjoezhang avatar sukkaw avatar tcrowe avatar terribledev avatar tomap avatar tombyrer avatar tommy351 avatar tsmgodoi avatar ujuiujumandan avatar wayou avatar xuanwo avatar yoshinorin avatar zjbarg avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

hexo-theme-landscape's Issues

Where to find the source for the rendered sample page?

On hexo.io there is a sample page based on the landscape theme showing all its possibilities.
https://hexo.io/hexo-theme-landscape

Unfortunately I can only find the rendered page but not the sources. As the documentation is very thin not showing every possibility, it would be nice to have some kind of sample or reference. Not everything shown on the page is clear to me so I'd really appreciate if someone can point to the sources of the sample page.

landscape怪怪的

我想換theme所以就試換theme每個都是一下,然後都沒有發現喜歡的,所以把它換回landscape,但是換完後卻如下圖!!
landscape怪怪的

實際情形到我的主頁看看就知道。

為甚麼會這樣呢 @tommy351 大大,救救我。

Pagination question

I'd like to be able to set different paginations. E.g. default as 0 but then the index as 10.

Wondering if the theme already supports this, or if it's possible please?

Translate theme

Hello.
I want to translate the theme. In other themes there is languages directory with translation files. But in this theme there is no files. Why? This theme does not yet support translation? Or how do I get the default translation file with english word set to create a translation based thereon?

Using Font-Awesome

How can Font-Awesome icons be used?

It seems like the CSS containing the classes isn't included in the generated css.

Code Blocks Break Responsiveness for screens <768px wide

When I add a code block to one of my posts, it breaks the resizing of all posts in the main area for windows with a width of <768px.

Behavior:
Resizing window slowly shrinks all posts on the page, including the code block which allows to scroll for overflow-x. UNITL the window hits 767px wide. After that, the code block is a static 615px and post divs start to disappear off the screen to the left as the window gets smaller.

I know that media queries change the layout at 768px, but I can't for the life of me find what changes that stops the code blocks from resizing width and allowing overflow-x: scroll

My inkling is that it may be a bug, but it may also be something I'm missing. any ideas would be hugely appreciated!

update FontAwesome

The major improvement over what you have now is smaller files with WOFF2, but perhaps offset by all the new icons B)

Could use MaxCDN, but jsDelivr has a far bigger network (with China, Africa, & India coverage).

Add post title to share button text in article.

When clicking share button on each article, we are now seeing only the permalink URL.

2016-12-15 2 48 50

Maybe we want something like this.

text = $this.attr('data-text'),
......
'<a href="https://twitter.com/intent/tweet?url=' + encodedUrl + '&text=' + text + '" class="article-share-twitter" target="_blank" title="Twitter"></a>',

Override the theme settings

Hello,
In my _config.yml I can override the menu settings but not the sidebar parameter.
Has the override limitations for this theme ?

Tag Cloud - how to show more than 40 tags ?

I am trying to work out how to show more than 40 tags in the tag cloud. In the tag list I see all tags (about 80), but in the tag cloud I only get 40.

Is there a configuration in the theme I can use to over-ride the default? I assume there must be, but having spend a day trying to figure this out I would appreciate any suggestions.

Thanks
John.

how to disable landscape theme?

I tried setting theme: false in my _config.yml but the landscape theme still shows up. How can I disable theming for my hexo blog?

Render problem with image inside a link (linked image)

Image inside a link (linked image) is not rendered properly.

Markdown:

[![](https://ctftime.org/static/images/CTFTIME-flat-logo-true.png)](https://ctftime.org/user/16344)

Rendered by the web browser:

<a href="https://ctftime.org/user/16344"  target="_blank" rel="external">
    <a href="https://ctftime.org/static/images/CTFTIME-flat-logo-true.png" title="" class="fancybox" rel="article0">
        <img src="https://ctftime.org/static/images/CTFTIME-flat-logo-true.png" alt="">
    </a>
</a>

Rendered the markdown renderer:

<a href="https://ctftime.org/user/16344">
    <img src="https://ctftime.org/static/images/CTFTIME-flat-logo-true.png" alt="" title="">
</a>

So when a user clic on an image he go to the image location instead of the link.

The html content generated by markdown it is good. But even with fancybox set to False, there is some javascript dynamically adding a fancybox class and changing the href.

At the end of each page there is

<script src="/js/script.js"></script>

This script contain:

[...]
// Caption
  $('.article-entry').each(function(i){
    $(this).find('img').each(function(){
      if ($(this).parent().hasClass('fancybox')) return;

      var alt = this.alt;

      if (alt) $(this).after('<span class="caption">' + alt + '</span>');

      $(this).wrap('<a href="' + this.src + '" title="' + alt + '" class="fancybox"></a>');
    });

    $(this).find('.fancybox').each(function(){
      $(this).attr('rel', 'article' + i);
    });
  });

  if ($.fancybox){
    $('.fancybox').fancybox();
  }
[...]

The ejs template including the script is themes/landscape/layout/_partial/after-footer.ejs.

Where you can see:

[...]
<% if (theme.fancybox){ %>
  <%- css('fancybox/jquery.fancybox') %>
  <%- js('fancybox/jquery.fancybox.pack') %>
<% } %>

<%- js('js/script') %>

So <%- js('js/script') %> is included even if theme.fancybox is false and that script is generating the problem.

The fancybox part of the code need be out of script.js and put in another script inside the condition statement <% if (theme.fancybox){ %>.

Google Analytics tracking code should be in <head> section

Due to https://support.google.com/webmasters/answer/35179#google_analytics_verification
Google Analytics tag should be in <head> section

The document of Google Analytics analytics.js tag said the same thing:

The code should be added near the top of the <head> tag and before any other script or CSS tags, and the string 'UA-XXXXX-Y' should be replaced with the property ID (also called the "tracking ID") of the Google Analytics property you wish to track.

From: https://developers.google.com/analytics/devguides/collection/analyticsjs

关于Google Fonts

现在的情况是
如果Googlefonts没有加载好
整个页面都不显示
然而对于大陆的孩纸们来说= - =
这点简直是折磨= - =
不知道有什么办法可以改进一下
或者加个地区判断,把fonts缓存到本地吧= - =
或者直接hexo的git下帮忙缓存一下= - =

does really landscape responsive ?

On a tablet the layout is reorganized to fit the device but the fonts size don't change neither the images size. the block code are also truncated.
any explanation ?

Embeded gist unreadable

I found the following styles are applied to {% gist %} tag plugin (with default landscape theme)

.article-entry .gist {
  margin: 0 -20px;
  border-style: solid;
  border-color: #ddd;
  border-width: 1px 0;
  background: #2d2d2d;
  padding: 15px 20px 15px 0;
}
{% gist 7071963 %}

The negative margin make no space between the text and the container.
Also, the dark background make it difficult to read the text.
"misc" and "history" header in the gist is barely readable.
selection_007

Is there any reason for the current .article-entry .gist sytle?

如何插入视频?

我看到demo中是用iframe来引入视频的,但是这样似乎没有办法控制视频的自动播放,不知道要有没有其它办法?谢谢

tag Cloud display not refresh

when I delete some previous tag, this tag cloud widget does not refresh, namely it still display tags that is not existing!!!

Layout shifting when loading

The theme is slightly modified (colors and round corners) but I get the same effect on the demo page and with an unmodified theme.

I tried to capture the problem in a gif:

animation showing the layout shifting

You can see the Adblock Plus message at the bottom, turning it off does not have any influence.

table in article looks wired

In landscape,when i insert a table into an article,there is a big blank area before the table,and I hava to add margin-top style to the table to make it looks normal.By the way,the blank space is not the same size in diffrent place of the article.Why?

Fancybox tag plugin generates malformed HTML source

When I use fancybox tag, Hexo generates malformed HTML source:

  • "a" element is not closed (missing "</a>")
  • caption element is not generated despite the existence of title string

I found a bug in scripts/fancybox.js:21 (lack of "+" operator at the end of line)

-    '<img src="' + (thumbnail || original) + '" alt="' + title + '">'
+    '<img src="' + (thumbnail || original) + '" alt="' + title + '">' +

hexo new page tags 页面内容为空

hexo: 3.2.0
hexo-cli: 1.0.1
os: Darwin 15.4.0 darwin x64
http_parser: 1.0
node: 0.10.35
v8: 3.14.5.9
ares: 1.9.0-DEV
uv: 0.10.30
zlib: 1.2.8
modules: 11
openssl: 1.0.1j

执行 hexo new page tags 后,hexo clean,hexo g,开启路由 /tags ,访问页面返回的内容为空,请问是什么原因?

Can't create category page

Issue from hexojs/hexo#2170 @phicarre

  1. I created a page with the command: hexo new page categories
  2. In source/categories/index.md, I added type: categories in the front matter
  3. In the _config.yml of the theme, I added in the menu: Categories: /categories
    but my page is always empty !
    What is missing ?

I also investigate the issue, and couldn't find a solution. Do we support category layout in this theme?

出现了重复的CATEGORIES条目

在侧边栏的CATEGORIES里面出现了重复条目,不过在“日志”和“文章”两个条目里,只有“文章”条目出现了重复。
图片一直传不上来,就先不传了,目前只是在本地测试还没有传到服务器上。

引用样式

OmniMarkupPreviewer
landsacpe
我希望能输出和图一一样的样式,该怎么样修改呢?

Google analytics not working

I'm having trouble enabling Google Analytics. I have this in my _config.yml:

google_analytics: "UA-48804932-1"

But I get nothing when serving. The landscape theme is the latest version (git commit 0815298a3) and here's the output of hexo version:

hexo: 3.0.0
os: Linux 3.16-3-amd64 linux x64
http_parser: 2.3
node: 0.12.1
v8: 3.28.73
uv: 1.0.2
zlib: 1.2.8
modules: 14
openssl: 1.0.1m

Anything I'm doing wrong here?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.