Does anyone know how to modify the look of a git book? I've seen 2 books that have a different look from the default:
http://codac.co/
http://coalman.github.io/tott-gulpjs/book/
But can someone point me in the right direction of how to customize the look and/or build a custom theme for gitbook?
I can't seem to find any documentation on customizing a gitbook.
If you are using the CLI Toolchain (as opposed to the online editor noted above), you need to create a directory called '/styles' in the root of your book then add a 'website.css' file to that directory.
Customize that website.css file to adjust the style of your gitbook.
'gitbook serve' or 'gitbook build' when done to view changes.
If you are editing your gitbook online at gitbook.com, you can edit the stylesheets by selecting the down arrow in the far right of the toolbar:
You can start to see the theme templates and change too see how it works
gitbook / theme /
gitbook / theme / stylesheets /
Related
I've just started using the WordPress page builder "Elementor" and have decided to move from "Genesis" to their own theme called "Hello Elementor". However, their theme uses SCSS and GruntJS.
On their documentation, they've included a custom.scss for all the custom styling. But when you add anything to this via WordPress, nothing happens. I know I could download the theme and use Visual Studio Code to make changes and use a sass compiler to automatically compile this for me, but it would require me to constantly upload files via FTP. Ideally, I would like to stay away from this.
Is there something I am missing? Or something I could do for WordPress to automatically compile this for me?
Edit:
If anyone has any recommendations of other themes to use with Elementor, I would really appreciate it.
They removed this option in Hello Elementor. You can no longer integrate custom scss. And I don't know since which version it's not present anymore, considering that I've tried the latest two ones and none of them seemed to accept the scss custom file.
However, you can check the answer they gave me a few days ago on the Hello Elementor GitHub page, if you want.
https://github.com/elementor/hello-theme/issues/85
Brackets comes with two themes installed, "Backets Light (Default)" and "Backets Dark". To see them, go to View | Themes...
I really like the "Brackets Dark" theme and I'd like to create a duplicate syntax theme of it for GitHub's Atom editor. I'm trying to locate these two default themes. Since they aren't third party themes, they aren't in the extensions folder. My question is where can I locate the "Brackets Dark" theme?
You can find the main.less and package.json for the Brackets Dark theme here (on Mac):
/Applications/Brackets.app/Contents/www/extensions/default/DarkTheme
to get to the Contents folder, just right click on the application and hit "Show Package Contents"
For Windows, you'll find the files here:
%ProgramFiles(x86)%\Brackets\www\extensions\default\DarkTheme
Does anyone know what to do next after you compile and get config.json in Bootstrap?
Any idea how to use it to update my current bootstrap.css?? or how to generate a css from it?? This is making me crazy, no enough documentation in Bootstrap about this..
I found this link: Twitter Bootstraps config.json - what does it do?
But the answer in there doesn't answer my questions. I'd really prefer more detailed answer. Thanks..^^
config.json stores the Customizer settings you used for your custom Bootstrap build.
You can reload those settings into the Customizer using the file upload at the top of the page.
You can also alternatively extract the LESS variable values from the JSON and compile Bootstrap manually using those values, if you have a LESS compiler installed locally.
How do I use Wordpress together with Twitter Bootstrap? I know how to set up a Wordpress page and I've already worked with Bootstrap, but now I want to use these two together for the first time.
For my Wordpress projects I normally just installed Wordpress and started from scratch with creating a new theme. For my Bootstrap projects I always used Initializr to build a template.
Now using Google I found various "Bootstrap themes" and plugins , do I need one of those? I want to customize the bootstrap look with my own colors etc. using LESS, that's why I am asking. I am just having trouble to understand how these two will work together and I haven't found any good resource for it.
There will be a few ways to tackle this, but here's what I've been doing...
Take a copy of your favorite starting point theme
Download the full bootstrap repo (less and everything) and pop it into your theme folder.
Create a folder called 'css' inside the bootstrap folder and set this as your location to output your compiled 'bootstrap.css' file.
Then up in the theme root, open 'styles.css', change the theme name etc as you would if you were creating a new theme, delete all the styles and add just one line of code #import url("bootstrap/css/bootstrap.css");
You should now be able to select this new theme from your 'appearances' menu in 'wp-admin'.
It'll obviously look horrific, but once you add a few of your theme classes/IDs into 'layout.less'. Then run through 'variables.less' to add you base theme you'll be getting somewhere.
Other than that you'll have to go through each template file and consider all the classes/IDs, sometimes edit the theme to make better use of existing bootstrap classes, but other times you'll need to add you're own custom classes to bootstrap.
It's quite time consuming, but once its done it can obviously be re-used to speed up future projects.
Incidentally, I've also been building a theme using this same principle but based on http://stuffandnonsense.co.uk/projects/320andup/ both great projects. I'd recommend seeing which best suits you.
You could always us the Twitter Bootstrap WordPress plugin. It's completely free on WordPress.org here: http://wordpress.org/extend/plugins/wordpress-bootstrap-css/
There's also lots of shortcodes included so you can include Bootstrap elements within your pages and post - there's a demo page of it all here: http://worpit.com/wordpress-twitter-bootstrap-css-plugin-home/wordpress-shortcodes-demo/
Hope that helps you get started!
I answered the same question before here at stackoverflow. I feel like it's kind of late sharing but for those who are looking for such tutorial just click the hyperlinked title given: Using Twitter Bootstrap in Wordpress.
There is a quick way to do it, using composer in your theme:
composer.json
{
"config": {
"component-dir": "lib/composer",
"vendor-dir": "lib/composer",
"bin-dir" : "bin/composer",
"cache-dir" : "var/cache/composer"
},
"require": {
"twitter/bootstrap": "3"
}
}
Note: I removed the other composer's section and requirements and phing integration to reduce complexity.
Execute
composer install
And then in your theme, add /lib/composer/twitter/bootstrap/dist/css/bootstrap.css with this sentences
$bootUri = get_template_directory_uri() . '/lib/composer/twitter/bootstrap/dist/css/bootstrap.css';
wp_enqueue_style('sindy_bootstrap', $bootsUri);
et voilà! :)
With Eclipse 4 new support of CSS themes, I wanted to ask if anyone was able to port Solarized (http://ethanschoonover.com/solarized) to it. I'm not looking for a simple Color Switch in the editor, but rather the whole window.
If no one is able or willing, would you please point me to a reference for the Theme styling?
Thank you.
Your best shot would be to start from this plugin : https://github.com/eclipse-color-theme/eclipse-ui-themes
And then modify the CSS.
Here are some resources:
http://wiki.eclipse.org/E4/CSS
http://wiki.eclipse.org/E4/CSS/SWT_Mapping
http://www.vogella.com/articles/Eclipse4CSS/article.html
Regards
you could use the Aptana Studio plugin's out-of-the-box themes, and create or customize one to suite your needs (let alone to create a custom Solarized theme). these themes can be set to "invasive" mode to force theme to all views (not just the editor).
to do so, simply open Window / Preferences / Aptana Studio / Themes and play with the various attributes:
here's an example for a custom theme made using the Aptana themes, that mimics stackoverflow's Java highlighter: