Difference between pages "News:Creating a Friendly Funtoo Culture" and "Package:Ghost (Blogging Platform)"

(Difference between pages)
(Created page with "{{News |Summary=This news item details some recent steps that have been taken to help ensure that Funtoo is a friendly and welcoming place for our users. |News Format=Extended...")
 
 
Line 1: Line 1:
{{News
+
{{Ebuild
|Summary=This news item details some recent steps that have been taken to help ensure that Funtoo is a friendly and welcoming place for our users.
+
|Summary=Ghost allows you to write and publish your own blog, giving you the tools to make it easy and even fun to do.
|News Format=Extended
+
|CatPkg=www-apps/ghost
|News Category=General
+
|Maintainer=anak1n
|Author=Drobbins
+
|Homepage=https://ghost.org
|Publication Status=Published
+
|Publication Date=2015/02/02
+
 
}}
 
}}
Hi everyone,
+
=== Description ===
 +
Ghost is an easy to use, quick, and light blogging platform that uses nodejs and is ready to go in minutes.  You can configure it to do anything from a self hosted blog for yourself, a blog that uses multiple users with their own usernames and profile pages.
  
I want to ensure that everyone who participates in the Funtoo Linux community is welcomed and treated with respect. Often times, this is challenging. Why? Let's face it. Many geeks are not known for their social skills, and are known to argue a lot and treat people like crap. That's just the culture that is out there in geek land, and we are impacted by it and have to deal with it pretty often.
+
=== Configuring Ghost ===
 +
To use Ghost in production (as opposed to development mode) you simply first run:
  
For Funtoo Linux, treating people badly is not something I'm okay with. There were recent 'bad behavior' issues in the #funtoo IRC channel. In response, a number of changes were made:
+
{{console|body=
 +
###i## emerge ghost
 +
###i## npm install --production
 +
}}
  
# I have opped a number of community-oriented and friendly Funtoo Linux users and staff. They have been encouraged to deal appropriately with people who are being assholes.  
+
Then configure your options in {{f|/usr/share/webapps/ghost/config.example.js}} and rename it to {{f|/usr/share/webapps/ghost/config.js}}:
# We now have a user <-> staff liaison to help to keep me and others abreast of violations of community standards.
+
{{file|name=config.js|lang=javascript|desc=ghost config|body=
# I'm putting myself out there as the final source of arbitration if you are treated badly, even by one of our ops. If you are, email me directly at drobbins@funtoo.org.
+
// # Ghost Configuration
 +
// Setup your Ghost install for various environments
 +
// Documentation can be found at http://support.ghost.org/config/
  
The #funtoo channel topic has been updated appropriately:
+
var path = require('path'),
 +
    config;
  
{{c|Funtoo Linux! http://www.funtoo.org - This is a laid-back channel. Rules: Treat people with respect. Ops are here to keep things friendly. Treated badly? email the BDFL: drobbins@funtoo.org.}}.
+
config = {
 +
    // ### Production
 +
    // When running Ghost in the wild, use the production environment
 +
    // Configure your URL and mail settings here
 +
    production: {
 +
        url: 'http://blog.somedomain.com',
 +
        mail: {
 +
            transport: 'SMTP',
 +
            options: {
 +
                service: 'Gmail',
 +
                auth: {
 +
                    user: 'user@gmail.com',
 +
                    pass: 'password'
 +
                }
 +
            }
 +
        },
 +
        database: {
 +
            client: 'sqlite3',
 +
            connection: {
 +
                filename: path.join(__dirname, '/content/data/ghost.db')
 +
            },
 +
            debug: false
 +
        },
  
I want everyone to know that this is an issue that is very important to me, and is essential to keeping Funtoo 'fun' and welcoming. You can and should expect our user community and staff to be respectful and polite to you, and if they are not, then I want to hear about it.
+
        server: {
 +
            // Host to be passed to node's `net.Server#listen()`
 +
            host: '0.0.0.0',
 +
            // Port to be passed to node's `net.Server#listen()`, for iisnode set this to `process.env.PORT`
 +
            port: '2368'
 +
        }
 +
    }
 +
};
  
Best Regards,
+
// Export config
 +
module.exports = config;
 +
}}
  
Daniel
+
{{note|You don't need to use Gmail as your mail, just an example. E-mail is only used for when you add users to the blog, it sends a notice so they can set up their own username and their own password, or if you forget your password and need to reset.}}
 +
 
 +
After you've completed setting up your {{f|config.js}}, you can start Ghost from:
 +
 
 +
{{console|body=
 +
###i## npm start --production
 +
}}
 +
 
 +
Once you confirm that it has started, you use the URL and port you provided in your browser: {{c|blog.somedomain.com:2368/ghost/signup}}
 +
 +
If you use Gravatar and use the e-mail used for that, it will automatically enable your Gravatar as your users avatar. You can disable this if you'd like by adding the following to your config.js
 +
 
 +
{{file|name=config.js|lang=javascript|desc=ghost config|body=
 +
privacy: {
 +
    useGravatar: false
 +
}
 +
}}
 +
 
 +
If you'd like to add SSL support for your blog, you can do so in {{f|config.js}}:
 +
{{file|name=config.js|lang=javascript|desc=ghost config|body=
 +
...
 +
        url: 'http://blog.somedomain.com',
 +
        urlSSL: 'https://secure.myblog.com'
 +
...
 +
}}
 +
 
 +
After this is all done, you can start using your blog. To use it you go to the domain your provided in {{c|config.js}}: {{c|blog.somedomain.com:2368/ghost}} and you will be able to publish, write drafts, and edit any posts.
 +
 
 +
=== Themes, adding Disqus and Google Analytics ===
 +
{{important|After changing any of the {{c|*.hbs}} files you need to restart your blogs instance.}}
 +
The default theme for Ghost is called {{c|Casper}} which is located in {{f|/usr/share/webapps/ghost/content/themes/}}. If you'd like to keep this them and edit it, it is recommended that you copy it to a different name, to change the name for picking in the theme section of the Ghost admin page, edit {{f|/usr/share/webapps/ghost/content/themes/my-theme/package.json}}:
 +
{{file|name=package.json|desc=theme|body=
 +
{
 +
  "name": "My Theme,
 +
  "version": "1"
 +
}
 +
}}
 +
 
 +
The file to edit for the CSS of your default theme would be in {{f|/usr/share/webapps/ghost/content/themes/my-theme/assets/css/}}.
 +
{{note|This requires a basic knowledge of CSS}}
 +
{{console|body=
 +
###i## cp -r /usr/share/webapps/ghost/content/themes/casper/ /usr/share/webapps/ghost/content/themes/my-theme
 +
###i## nano -w /usr/share/webapps/ghost/content/themes/my-theme/assets/css/screen.css
 +
}}
 +
 
 +
{{file|name=screen.css|lang=css|desc=ghost theme|body=
 +
# Changing blockquotes:
 +
blockquote {
 +
    -moz-box-sizing: border-box;
 +
    box-sizing: border-box;
 +
    padding-left:5px;
 +
    padding-top:10px;
 +
    padding-bottom:10px;
 +
    border-left: #fff 3px solid;
 +
    margin:25px;
 +
    line-height:1.3em;
 +
}
 +
 
 +
# Changing preformatted text for source code:
 +
pre {
 +
    -moz-box-sizing: border-box;
 +
    box-sizing: border-box;
 +
    margin: 0 0 1.75em 0;
 +
    border: #E3EDF3 1px solid;
 +
    width: 100%;
 +
    padding: 9.5px;
 +
    font-family:'Source Code Pro', monospace;
 +
    font-size: 13px;
 +
    white-space: pre;
 +
    overflow: auto;
 +
    background: #000;
 +
    border-radius: 6px;
 +
    color:#ccc;
 +
    word-break:break-all;
 +
    word-wrap:break-word;
 +
}
 +
}}
 +
You may edit as much as you'd like in this file, though if you add new a new {{c|div}} for the main page you'll have to make sure to add it in {{f|/usr/share/webapps/ghost/content/themes/my-theme/default.hbs}}.
 +
 
 +
You may also get some free themes from the [http://marketplace.ghost.org/themes/free/ Ghost Marketplace].
 +
 
 +
==== Adding Disqus ====
 +
[https://disqus.com/ Disqus] is a great way to keep in contact with your readers via comments. It is suggested that you add it to your blog if you'd like feedback on your posts, or just would like to stay in contact with your readers. This is not required, though.
 +
 
 +
In order to add Disqus, you'll need to sign up at their website, then grab the code. It will be labeled as 'Universal code' on your Disqus homepage. You must then add this code to {{f|/usr/share/webapps/ghost/content/themes/(theme name)/post.hbs}}. This will be pasted anywhere between {{c|<nowiki>{{/post}}</nowiki>}} and {{c|</article>}}.
 +
{{file|name=post.hbs|lang=javascript|desc=adding Disqus|body=
 +
  </footer>
 +
  <div id="disqus_thread"></div>
 +
  <script type="text/javascript">
 +
    var disqus_shortname = 'example'; // required: replace example with your forum shortname
 +
    var disqus_identifier = '{{post.id}}';
 +
 
 +
    /* * * DON'T EDIT BELOW THIS LINE * * */
 +
    (function() {
 +
      var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
 +
      dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
 +
      (document.getElementsByTagName('head')[0]  {{!}} {{!}} document.getElementsByTagName('body')[0]).appendChild(dsq);
 +
    })();
 +
  </script>
 +
  <noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
 +
  <a href="http://disqus.com" class="dsq-brlink">comments powered by <span class="logo-disqus">Disqus</span></a>
 +
</article>
 +
}}
 +
After this, you'll have comments added to your blog!
 +
 
 +
==== Adding Google Analytics ====
 +
If you track the traffic to your blog and use Google Analytics, you simply need to edit your {{f|/usr/share/webapps/ghost/content/(theme name)/default.hbs}} and add the code in between the {{c|<head>}} and {{c|</head>}}.
 +
{{file|name=default.hbs|lang=javascript|desc=adding Google Analytics|body=
 +
<head>
 +
...
 +
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r] {{!}}{{!}}function(){
 +
    (i[r].q=i[r].q {{!}}{{!}}[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
 +
    m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
 +
  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
 +
 
 +
    ga('create', 'UA-XXXXXXXX-X', 'yourblog.ghost.io');
 +
    ga('send', 'pageview');
 +
...
 +
</head>
 +
}}
 +
This will activate Google Analytics for you to see your traffic!
 +
=== Adding nginx or Apache support ===
 +
As I'm sure no one wants to host their blog from having to constantly add a port number (i.e {{f|myblog.com:2368}}), you can have it go through Apache or nginx.
 +
 
 +
It's really pretty simple. In Apache under {{f|/etc/apache2/vhosts.d/00_default_vhost.conf}}:
 +
{{file|name=00_default_vhost.conf|desc=Apache|body=
 +
<VirtualHost *:80>
 +
    ServerName blog.somedomain.com
 +
    CustomLog /var/log/apache2/myblog.log combined
 +
    ProxyRequests Off
 +
    ProxyPass / http://localhost:2368
 +
    ProxyPassReverse / http://localhost:2368
 +
    ProxyPass /* http://localhost:2368
 +
    ProxyPassReverse /* http://localhost:2368
 +
</VirtualHost>
 +
}}
 +
 
 +
Nginx is pretty straightforward as well. In your {{f|sites-enabled}} directory you can add a new file, or wherever you store your virtual hosts, and set it.
 +
{{file|name=blog.conf|desc=Nginx|body=
 +
server {
 +
    listen 0.0.0.0:80;
 +
    server_name blog.somedomain.com;
 +
    access_log /var/log/nginx/myblog.log;
 +
 
 +
    location / {
 +
        proxy_set_header X-Real-IP $remote_addr;
 +
        proxy_set_header HOST $http_host;
 +
        proxy_set_header X-NginX-Proxy true;
 +
 
 +
        proxy_pass http://127.0.0.1:2368;
 +
        proxy_redirect off;
 +
    }
 +
}
 +
}}
 +
And there you have it! You can promptly go to your domain without having to manually add the port!
 +
=== Conclusion ===
 +
The Ghost blogging platform is a great small, tool. This should be enough to get you well on your way to your new blog!
  
{{NewsFooter}}
+
{{EbuildFooter}}

Latest revision as of 07:17, February 2, 2015

www-apps/ghost


Current Maintainer(s):anak1n c
Source Repository:Funtoo Overlay
Homepage

Summary: Ghost allows you to write and publish your own blog, giving you the tools to make it easy and even fun to do.


News

Drobbins

Better Experiences: Ego and Vim

Info on Funtoo's new personality tool called 'ego', and user-focused updates to vim's defaults.
27 April 2015 by Drobbins
Drobbins

How We're Keeping You At the Center of the Funtoo Universe

Read about recent developments that keep you, our users, at the forefront of our focus as Funtoo moves forward.
10 April 2015 by Drobbins
Mgorny

New OpenGL management in Funtoo

Funtoo is switching to an improved system for managing multiple OpenGL providers (Mesa/Xorg, AMD and NVIDIA). The update may involve blockers and file collisions.
30 March 2015 by Mgorny
View More News...

Ghost (Blogging Platform)

Tip

This is a wiki page. To edit it, Create a Funtoo account. Then log in and then click here to edit this page. See our editing guidelines to becoming a wiki-editing pro.

Description

Ghost is an easy to use, quick, and light blogging platform that uses nodejs and is ready to go in minutes. You can configure it to do anything from a self hosted blog for yourself, a blog that uses multiple users with their own usernames and profile pages.

Configuring Ghost

To use Ghost in production (as opposed to development mode) you simply first run:

# emerge ghost
# npm install --production


Then configure your options in /usr/share/webapps/ghost/config.example.js and rename it to /usr/share/webapps/ghost/config.js:

config.js (javascript source code) - ghost config
// # Ghost Configuration
// Setup your Ghost install for various environments
// Documentation can be found at http://support.ghost.org/config/
 
var path = require('path'),
    config;
 
config = {
    // ### Production
    // When running Ghost in the wild, use the production environment
    // Configure your URL and mail settings here
    production: {
        url: 'http://blog.somedomain.com',
        mail: {
            transport: 'SMTP',
            options: {
                service: 'Gmail',
                auth: {
                    user: 'user@gmail.com',
                    pass: 'password'
                }
            }
        },
        database: {
            client: 'sqlite3',
            connection: {
                filename: path.join(__dirname, '/content/data/ghost.db')
            },
            debug: false
        },
 
        server: {
            // Host to be passed to node's `net.Server#listen()`
            host: '0.0.0.0',
            // Port to be passed to node's `net.Server#listen()`, for iisnode set this to `process.env.PORT`
            port: '2368'
        }
    }
};
 
// Export config
module.exports = config;
Note

You don't need to use Gmail as your mail, just an example. E-mail is only used for when you add users to the blog, it sends a notice so they can set up their own username and their own password, or if you forget your password and need to reset.

After you've completed setting up your config.js, you can start Ghost from:

# npm start --production


Once you confirm that it has started, you use the URL and port you provided in your browser: blog.somedomain.com:2368/ghost/signup

If you use Gravatar and use the e-mail used for that, it will automatically enable your Gravatar as your users avatar. You can disable this if you'd like by adding the following to your config.js

config.js (javascript source code) - ghost config
privacy: {
    useGravatar: false
}

If you'd like to add SSL support for your blog, you can do so in config.js:

config.js (javascript source code) - ghost config
...
        url: 'http://blog.somedomain.com',
        urlSSL: 'https://secure.myblog.com'
...

After this is all done, you can start using your blog. To use it you go to the domain your provided in config.js: blog.somedomain.com:2368/ghost and you will be able to publish, write drafts, and edit any posts.

Themes, adding Disqus and Google Analytics

Important

After changing any of the *.hbs files you need to restart your blogs instance.

The default theme for Ghost is called Casper which is located in /usr/share/webapps/ghost/content/themes/. If you'd like to keep this them and edit it, it is recommended that you copy it to a different name, to change the name for picking in the theme section of the Ghost admin page, edit /usr/share/webapps/ghost/content/themes/my-theme/package.json:

package.json - theme
{
  "name": "My Theme,
  "version": "1"
}

The file to edit for the CSS of your default theme would be in /usr/share/webapps/ghost/content/themes/my-theme/assets/css/.

Note

This requires a basic knowledge of CSS

# cp -r /usr/share/webapps/ghost/content/themes/casper/ /usr/share/webapps/ghost/content/themes/my-theme
# nano -w /usr/share/webapps/ghost/content/themes/my-theme/assets/css/screen.css


screen.css (css source code) - ghost theme
# Changing blockquotes:
blockquote {
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding-left:5px;
    padding-top:10px;
    padding-bottom:10px;
    border-left: #fff 3px solid;
    margin:25px;
    line-height:1.3em;
}
 
# Changing preformatted text for source code:
pre {
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0 0 1.75em 0;
    border: #E3EDF3 1px solid;
    width: 100%;
    padding: 9.5px;
    font-family:'Source Code Pro', monospace;
    font-size: 13px;
    white-space: pre;
    overflow: auto;
    background: #000;
    border-radius: 6px;
    color:#ccc;
    word-break:break-all;
    word-wrap:break-word;
 }

You may edit as much as you'd like in this file, though if you add new a new div for the main page you'll have to make sure to add it in /usr/share/webapps/ghost/content/themes/my-theme/default.hbs.

You may also get some free themes from the Ghost Marketplace.

Adding Disqus

Disqus is a great way to keep in contact with your readers via comments. It is suggested that you add it to your blog if you'd like feedback on your posts, or just would like to stay in contact with your readers. This is not required, though.

In order to add Disqus, you'll need to sign up at their website, then grab the code. It will be labeled as 'Universal code' on your Disqus homepage. You must then add this code to /usr/share/webapps/ghost/content/themes/(theme name)/post.hbs. This will be pasted anywhere between {{/post}} and </article>.

post.hbs (javascript source code) - adding Disqus
</footer>
  <div id="disqus_thread"></div>
  <script type="text/javascript">
    var disqus_shortname = 'example'; // required: replace example with your forum shortname
    var disqus_identifier = '[[:Template:Post.id]]';
 
    /* * * DON'T EDIT BELOW THIS LINE * * */
    (function() {
      var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
      dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
      (document.getElementsByTagName('head')[0]  | | document.getElementsByTagName('body')[0]).appendChild(dsq);
    })();
  </script>
  <noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
  <a href="http://disqus.com" class="dsq-brlink">comments powered by <span class="logo-disqus">Disqus</span></a>
</article>

After this, you'll have comments added to your blog!

Adding Google Analytics

If you track the traffic to your blog and use Google Analytics, you simply need to edit your /usr/share/webapps/ghost/content/(theme name)/default.hbs and add the code in between the <head> and </head>.

default.hbs (javascript source code) - adding Google Analytics
<head>
...
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r] ||function(){
    (i[r].q=i[r].q ||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
    m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
 
    ga('create', 'UA-XXXXXXXX-X', 'yourblog.ghost.io');
    ga('send', 'pageview');
...
</head>

This will activate Google Analytics for you to see your traffic!

Adding nginx or Apache support

As I'm sure no one wants to host their blog from having to constantly add a port number (i.e myblog.com:2368), you can have it go through Apache or nginx.

It's really pretty simple. In Apache under /etc/apache2/vhosts.d/00_default_vhost.conf:

00_default_vhost.conf - Apache
<VirtualHost *:80>
    ServerName blog.somedomain.com
    CustomLog /var/log/apache2/myblog.log combined
    ProxyRequests Off
    ProxyPass / http://localhost:2368
    ProxyPassReverse / http://localhost:2368
    ProxyPass /* http://localhost:2368
    ProxyPassReverse /* http://localhost:2368
</VirtualHost>

Nginx is pretty straightforward as well. In your sites-enabled directory you can add a new file, or wherever you store your virtual hosts, and set it.

blog.conf - Nginx
server {
    listen 0.0.0.0:80;
    server_name blog.somedomain.com;
    access_log /var/log/nginx/myblog.log;

    location / {
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header HOST $http_host;
        proxy_set_header X-NginX-Proxy true;

        proxy_pass http://127.0.0.1:2368;
        proxy_redirect off;
    }
}

And there you have it! You can promptly go to your domain without having to manually add the port!

Conclusion

The Ghost blogging platform is a great small, tool. This should be enough to get you well on your way to your new blog!