Editing Publisher:Beyond-Social (section)

== Editing the skin ==

'''skin.json''': This file is the settings file for the Beyond Social skin. Here, you can add media queries to make the wiki respond to different screen sizes and include a stylesheet for printing. See line 33, &quot;ResourceModules&quot;.

'''css''': All the css files of the skin are included in the /skin/BeyondSocial/components/ folder. Another option could have been to use the common.css page on the wiki, but due to the amount of css we needed to add, we decided to store it in the skin folder itself. The skin works with .less in stead of .css files. We continued to work with less as the Vector skin was based on these files. There is a .less file for different sections of the wiki: for example there is a footer.less, navigation.less and personalMenu.less. These .less files originated from the Vector skin, but are edited according to match our wishes. The files bs-editorials.less, bs-mainpage.less and bs-namespaces.less are added for Beyond Social. Less enabled us to work with variables in css, something new for me but very useful. There is a variables.less file in the main /BeyondSocial/ folder in which all the main variables are stored that are called in the other .less files.

'''php''': BeyondSocialTemplate.php is the most important php file. Some elements have been moved around here, and a few lines of html have been added, but we tried to add as less as possible. The lines that are changed are marked with comments.

'''js''': beyondsocial.js is where you can add javascript functions. The only javascript that is added to the skin is called by the Share option in the menu. It selects the first image of a page, and include that as a header in the html. Facebook's sharing function reads this image and places it next to the link you want to share.