How to customize DSpace theme? - css

I have installed DSpace on my PC. I am using Mirage as a default theme and now I want to customize it for my DSpace. I want to change CSS files (redesign it), but I don't know the steps to properly set my customizations. I can edit my CSS files in [dspace]/webapps/themes/Mirage/lib/css/ folder, but after rebuilding DSpace they will be removed. What is the correct way doing customizations over already installed theme? Should I edit CSS files and add them to [dspace-source]/dspace/modules/src/main/ folder and then rebuild my webapps? I have read official documentation about that, but I couldn't find proper answer to my question.

Create a folder for your theme in [dspace-src]/dspace/modules/xmlui/src/main/webapps/theme/[yourTheme]
Copy the CSS (or js or xsl) files you wish to modify into that directory - you can find a copy of the source files in [dspace-install] as you have referenced, or you can find them on the project github page
Edit your changes
Run the maven build in [dspace-src]/dspace: "dspace package" - this command will pull the source files for the theme and overlay your customizations. The results are built into the "target" folder.
cd into [dspace-src]/dspace/target/dspace-installer
Run "ant update" - this command will take the built files and install them into [dspace-install]
Restart tomcat
The following page has some resources that might be useful.
https://wiki.duraspace.org/display/DSDOC5x/XMLUI+Configuration+and+Customization

Related

Upgrading from Bootstrap 4.0 to 4.5

I am trying to upgrade from Bootstrap 4.0.0 to 4.5.0 on my WordPress. From reading another thread, I believe I simply need to find certain files and replace the 4.0.0 versions with 4.5.0 versions., specifically CSS and JS folders.
I downloaded the 4.5.0 source files from Bootstrap's website. In the WordPress site theme I have active, I see inside /node_modules/bootstrap/ a collection of folders that match folders inside the Bootstrap 4.5.0 source files I downloaded. Specifically (all at the same level):
A folder titled "dist" with subfolders "css" and "js"; the contents
appear very similar between the source files and what I already have
A folder titled "js" with subfolders "dist" and "src"; the contents
appear very similar between the source files and what I already have,
but the source files folder also has a folder "tests" that is not on
my existing site
A folder titled "scss" with subfolders "mixins" and "utilities" as
well as a number of .scss files; the contents appear very similar
between the source files and what I already have
There are also some stray files in the /node_modules/bootstrap/ folder (LICENSE, package.json and README.md) that are also in the 4.5.0 source files.
All of this makes me feel that this is the place I need to replace the 4.0.0 files with the 4.5.0 files. However there are several files in the 4.5.0 source files not present in /node_modules/bootstrap/:
_config.yml
a folder "build" with various .js files
CNAME
CODE_OF_CONDUCT.md
composer.json
Gemfile
Gemfile.lock
package-lock.json
package.js
SECURITY.md
From my limited understanding, I think the 4.5.0 source files have more than any given person may need, and that makes me think these files may not be essential for my purposes, if they are not already in the /node_modules/bootstrap/ folder on my existing site. I'm also in a dev environment, so I could just give it a go and see what happens.
My other concern is, I see in /dist/styles/main.css there is what appears to be all the 4.0.0 css, as well as additional css for plugins. Do I need to manually update the portion of this css file with the 4.5.0 css?
I'd avoid updating node_modules manually as the packages listed there were created by a package manager (more than likely, npm) and as such specific versions were installed with dependencies. Editing files in there can break your app!
If you can, look for a package.json file in the parent folder of node_modules and update the version of bootstrap in there, then run npm install in the terminal.

Can build_site() not overwrite .gitignore in public/?

I'm following the suggestion on this section to put the public/ folder under version control. Hugo seems to generate an automatic .gitignore files every time I build the site. The default .gitignore ignores everything except itself. Now after I run build_site(), I need to manually overwrite the default .gitignore for the changes to show up.
Is there an option that can turn off the overwriting of .gitignore?
I experienced a similar problem when generating my site with a theme I forked from github. I use git to to track changes in the course files and then to push the generated site to GitHub where the site is hosted. I created a .gitignore file in the source files for the hugo site so it would ignore .DS_Store and .icloud files but when I ran hugo -D, the .gitignore file in the generated site repo would also be modified but appear empty.
The issue was that there was extra .gitignore files lurking in the template and theme files that I had forked. Deleting them with and regenerating the site files from source without running hugo mod clean --all fixed the issue.

custom theme to wordpress roots theme

I am new to roots theme and want to change my custom wordpress theme to roots theme.
What are the steps that i should follow so that finally m able to get my theme in roots.
I would be glad if there is such tutorials that help me getting started to roots and converting my theme to roots.
Any link please help
thanks,
suku
Roots has some dependencies, so you would need to use Grunt.
My answer is based on a Windows local environment.
Make sure you set your wp-config file for Roots for development or you’ll notice nothing changes in your css when you update: define('WP_ENV', 'development');.
Make a new folder in your WordPress theme directory.
Grab the latest ZIP from the Github for Roots and take the guts to set up in your theme.
Extract the zip. Contents should all be saved in the folder of your new theme. As you can see if you look around, some of the assets are missing because you really do need to use Grunt for this to work.
Download and install Node.js
Install grunt (go to the Node.js command prompt and type in npm install -g grunt-cli to install Grunt globally on your system so you can access from a project folder anywhere. You can use the command where grunt to make sure the path is under user > AppData > Roaming > npm.
Install Git Bash
Right click in your new roots theme folder and click Git Bash Here and then type in npm install.
Install Roots dependencies by running grunt dev. Run grunt watch to watch the folder for code changes. Edit your code to style accordingly and ass needed (assets/less is where the style mods should live (global, and in layouts folder) and lib/extras.php for function overrides).
Run grunt built command to create minified asses for a live environment (and then change your wp-config to define('WP_ENV', 'production'); so it uses those assets.
After that you can port the theme out (minus the node_modules folder since it's added bloat you don't need) and install.

How to install site-specific modules in a Drupal 7 multi-site?

I have a "multi-site" installation of Drupal 7, which means that I have these folders in my "sites" folder:
all
domain.one
domain.two
domain.x
And in each of these folders, I also have "modules" and "themes" folders.
If I click the "install new module" link on the modules page ("admin/modules") from any domain X, Drupal tries to download modules in the "all/modules" folder instead of the "X/modules" folder.
Maybe I am not using the proper phrase to search in Google, but I do not see similar problems, so it may just be my problem.
How to install site-specific modules in a Drupal 7 multi-site?
You can try the example detailed out in this post: http://www.pixelclever.com/how-set-up-drush-for-multisite-installation which basically requires you to create a drushrc.php file for each multisite, which includes the path to the respective modules folder.
Here are the lines from that post that explain
To start, go to your drush folder where you will find a file entitled example.drushrc.php. Copy that file into the individual site folder in your Drupal multisite installation (sites/yourmultisite), and rename the file to drushrc.php.
Now open that file and add the following line:
$command_specific['dl']['destination'] = 'sites/yourmultisite/modules';
or
$command_specific['dl']['destination'] = 'sites/yourmultisite/modules/contributions';
This is also a step by step walkthrough of the updating process using drush on multisites.
http://rinen.net/2013/02/updating-a-drupal-multisite-using-drush/
I found good article for multisite install here,
http://mydons.com/drupal-7-multisite-install-steps-in-linux/
http://mydons.com/drupal-7-multisite-install-steps-in-windows/
This worked for me:
Changed working directory on terminal to specific site directory
i.e. "cd [drupal_site_directory]/sites/[site_one]/ "
use usual drush command to install modules i.e. "drush dl [module_name]"
Hope this might help you guys also.
.

How to clone WordPress theme from github

I've been developing a wordpress theme on a dev site, and all along I've been pushing it to github. It's now ready to be deployed to my live site, but I'm not sure how to do that.
What I've tried so far (that didn't work) is creating an empty /wp-content/themes/my-theme/ directory on my live site, and I cd into it. Then I use git clone git#github.com:path/to/my-theme.git but that creates another directory inside of my my-theme/ directory with all of the theme files inside of it. To clarify, that now creates:
/wp-content/themes/my-theme/my-theme/[all theme files here]
But I just want the files from the github repo to be placed directly into the original empty my-theme directory that I created.
try git clone <repo> . -- you can specify the directory as the last argument.

Resources