Where can I customize the appearance of Disqus in my Octopress blog? - css

I am using Octopress for my blog. I set up Disqus and it shows up on every article. However, I really need to customize the look because right now there is literally no space between the whole disqus comment box and the right border of the browser window.
I already tried to find the correct SCSS file but I couldn't find it. Can anyone help me?

I don't think there are custom styles for disqus anywhere in the default octopress theme.
I would add a new partial undess sass/partials say _disqus.scss and then import the file in _partials.scss
#import "partials/disqus";

for anyone searching for a good answer (I am sure #Vassilis works just fine): Just go to
octopress/sass/base/_layout.scss
In that file go to
section.comments {}
and add something like this (this align the comments with your blog text)
max-width: 500px;

Related

How to change height of default wordpress embed link "windows"

could anyone tell me if it's possible to make all these(in picture) wp-default links with class .wp-embed .post same height so that it won't look horrible like in picture.enter image description here I know that it is programmed so that the height addapts to text size inside it.
How do i do that, i can't find they way how to overwrite that with CSS. Is it only achievable by PHP / if so how - i can barely read PHP for now...
There are two separate questions here:
How do I change the css on a wordpress site?
The answer is that it will depend on the setup of your site.
-- You may have access to edit the css for the theme by going to Dashboard -> Appearance -> Editor and then finding the style.css
-- You may also have access to edit the css file through manually editting the file on the server.
-- if those first two options don't work, and you are able to add plugins, you can add a plugin to let you add css to the page. Simple Custom Css is one such plugin.
How do I fix this particular css problem?
To answer this question I would need to see more of the css and html for this page

Using a Custom font on weebly blog

I'm trying to use a custom font on my blog which is I haven't make it work yet. Maybe you guys can help me out on this.
I just want my blog title to have its own font. here's the HTML structure
http://prntscr.com/curez2
First thing I did was I uploaded my ttf font in my asset folder
http://prntscr.com/cura4a
Next, import the font in CSS "main_style.css"
http://prntscr.com/curfro
here's the class on my blog-title
http://prntscr.com/curgr8
did I miss something? can someone help me out please. thanks!!
You need to include the full path to the .ttf file on http://prnt.sc/curfro
It looks like you have everything right, however not seeing a live example makes it a little hard to isolate. But there are a few things to consider. For example:
Did you try publishing the site?
Are you ONLY trying the Blog Title?
IF you have set your Font Settings for the Title and Blog Post
Title, to a specific font, it's going to override the Theme's design
and your custom Font. In that case edit the Font Settings and choose
"Default". Then try to see if it works(dont forget to publish). See: https://hc.weebly.com/hc/en-us/articles/201505666-Edit-Fonts
Is the 'Content Area' a div with an ID of content <div id="content"></div> (IF not that could be the issue.) Note: #content h2.blog-title could also be written as .blog-post .blog-header h2.blog-title
Have you tried a different font file(try a different font type/file)
With that, you should at least be able to isolate the issue, if not resolve it.

My responsive work in local but not when it's on the server

I work as an intern on a website wich is actually protected with pass so I can't give you the link...
Anyway, I will ask the question and if you need some code I can give it.
So, there is a responsive design for the mobile made buy an external party which created the design/css. The responsive work correctly when I work with wampServer, and I resized the page with the ctrl+maj+m on firefox.
The actual problem is, when I put the same page on the server, the responsive don't work anymore... on firefox and on mobile phones.
I don't get how is that possible, so maybe someone encountered the same problem and has some tips?
Thank you
EDIT : There is ONE page which still works online, but I really don't get why, it has exactly the same code as the others... the 'responsive code' is included in each page at the top with the footer too (but this one is at the end of the page). Just the body changes on every page.
EDIT EDIT :
Here is the sample code. header.php, head.php, mainmenu.php.
EDIT OF THE MASTER EDIT :
Thanks Abdul-Rafay Shaikh.
Well, all of the css is imported in the import <link rel="stylesheet" href="assets/css/zz-all.css" type="text/css" />. Which is called in the head.php. The path is good, in fact it works in one page and not the others. I think I have to check, line by line, all of the code to find maybe an import that f***ed all up, or something like that.
Thanks for all your help anyway :)
Well I think the responsive template you are using maybe used javascript to actually make breakpoints and as you told us that the one page that is working when deployed on a real server has the responsive css in the footer. So my solution would be put the css of all the pages in the footer or check wether any js is actually making the breakpoint and put the CSS after that javascript.
The Second thing is the path's maybe your CSS that has the responsive code has their path defined preceding localhost/ or some thing like that check that.
Third if there is no javascript that is making your website responsive and its only css import your responsive CSS to the main stylesheet
In your main style sheet
#import url("responsive.css");
just to make sure that your responsive style sheet is loaded whenever your main style sheet is loaded.
I hope this solves the problem

How to make product description in Magento Go Not Italicized

I recently changed Magento Go templates, but there is one issue with the template I'm currently using. The entire product description is italicized, and I cannot figure out how to remove this 'feature'. I've tried searching here and on the Magento forums for an answer.
So far, I've tried italicizing the text to see if it would negate the native italicization, to no avail. I've looked at this solution:
http://www.rockettheme.com/forum/index.php?f=264&t=192000&rb_v=viewtopic
But it's only applicable to Magento CE, it looks like.
I've added this:
p.normal {font-style:normal;}
to the custom CSS for the template, and to the "Custom Layout Update" field on the individual product, to no avail.
EDIT
OK, I think I've figured out how to do this, but I have no idea how to properly format the CSS to work. I've got this far:
.DIV.tab-content: { p.normal {font-style:normal !important}}
but it's not working. I'm sure the formatting is wrong; would someone be so kind as to point me in the right direction as to how to fix this? Thanks.
Try adding the !important rule to your CSS.
p.normal {font-style:normal !important;}
Reference:
http://css-tricks.com/when-using-important-is-the-right-choice/
Got it! I had to learn a couple of things (which is always nice) to come up with this. Hope it helps someone else. Just add this to the custom CSS box of the theme that you're using:
.tab-content {font-style:normal !important;}

How to format text to looks like code in wordpress like stackoverflow {} tool?

I need to format text in posts using WordPress to look like a code. Like here in stackoverflow we use { } to separate the code from the text. I need to do the same when I write my blogs in Wordpress
Example ....
code will look like that !
Do you like the one used here: http://inturnets.com/2012/06/a-nice-tackling-with-jquery-and-css.html ?
It's the syntaxhighlighter wp plugin, http://www.viper007bond.com/wordpress-plugins/syntaxhighlighter/ , a very customisable one and finally you are using simple tags like [html] html code [/html] or [css] css code [/css]
Good luck! :)
Wordpress has a preformatted paragraph style that works OK without any plugins. Just select the text and then select the Preformatted style on the left side of the formatting bar:
I had installed a plugin, but then found this simpler and it works fine for my purposes.
This might be helpful to you
http://textformat.in/
Please do vote if it worth

Resources