I'm trying to manually position the Shareaholic sharebar WP plugin. I am using a vertical one, and want it to be in a fixed position on the left side of my screen beside my main content area. So far I have figured out how to get it onto my site, but not able to position it. I'm referencing this post of someone who tried to do a similar thing.
I'm using this code to insert it into my single.php
<?php echo do_shortcode('[shareaholic app="share_buttons" id="4766761"]'); ?>
But haven't had any luck with getting css positioning to work, or where exactly to put it in my single.php file
Right now it's just below this code :
<main class='content units <?php avia_layout_class( 'content' ); ?>' <?php avia_markup_helper(array('context' => 'content','post_type'=>'post'));?>>
And it's showing up above the post content.
Any suggestions?
Many thanks
Jonny
Custom CSS should be added to your styles.css theme file, but it is recommended to create a child theme when making any adjustments within your theme so that you will not run the risk of losing your customization if/when your theme releases a new version and you update.
Related
For whatever reason, whenever I build my project, any changes I've made to a view that are not html do not get displayed. Instead it pulls all the info from the partial view (which in our application doesn't get updated when I make a change in the view). So every time I build my project, the application serves me the partial view and I have to go into each view that I made changes in and make some sort of html change in order for the changes I made prior to the build display. Eventually, this functionality will change, but right now my boss doesn't want to mess with it just yet. I've tried disabling cache in chrome's dom (f12) as well as downloading an extension to force the page to not display any chached versions of pages but that doesn't seem to help. What else can I do until we get the partial views removed properly?
UPDATE:
I kinda goofed on the title. Whats happening is the generated files are what are being served to me from my localhost rather than any changes I made to a view (html or otherwise), if I made those changes prior to a build.
so in the view I'd have this:
<body>
<div>Hello World!</div
<div><h2>Sample Text</h2></div>
</body>
<script>
$(document).ready(function () {
//Some Javascript code
});
Which is the way the page was originally created by someone else. They also manually made a partial generated file and that file doesn't rre-generate when I make changes to the view.
So if I made these changes:
<body>
<div>Hello World again!</div
<div><h2>Sample Text</h2></div>
</body>
<script>
$(document).ready(function () {
//Some Javascript code
});
and then built the project, it would not serve me these changes, it would grab the generated file (which didn't get updated with my changes) and serve that to me unless AFTER I do the build, I go into that specific view and make an HTML Change (for some reason making a change with Javascript doesn't help). Then I can see my changes. AND it will stay that way until I do another build at which point, everything reverts back to the partial generated views until I make an HTML change in the view.
Deleting the Generated files is the only way I can see to fix the problem I just wasn't sure if it would break the application and it doesn't.
I'm building a google-style text box that auto-completes typed text.
Using typeahead with typeahead.js-bootstrap.css:
$(document).ready(function() {
$('#op1').typeahead({
remote: '/search/%QUERY',
});
});
<input type="text" id="op1">
it worked but there are two problems:
I could not customize it. Whenever I make any significant style changes, or use bootstrap's form-control class for input element: the text box gets completely messed up.
The auto-completed ("hint") text was written above the typed text so I whatever color I set for the hint was the color of the entire text! I tried giving the hint a negative z-order but then it was not displayed at all.
I've tried Typeahead AND Select2 auto-completion libraries with my Bootstrap 3 template, and so far the only thing I was able to work out-of-the-box without completely ruining the layout was the above code
If anyone can solve these problems, or otherwise recommend a full CSS + JS typeahead solution for Bootstrap3, I'd be grateful :)
It gives you completely easy way to customise the look with formatresults. You can even write full html view for your results. and to customise the look of input box apply a class to the wrapper for your search box and override select2 rendered css(load the page and check from browser that from where that style is coming).
http://ivaynberg.github.io/select2/
I made a full featured customised search with this.
There is now a fork available for select2 that supports Bootstrap 3.
http://fk.github.io/select2-bootstrap-css/
https://github.com/fk/select2-bootstrap-css#readme
I want to set up both date and time in a custom field (Yii).
For this i've chosen this datetimepicker.
But as i've loaded it into protected/extentions it now works, but its outlook is somehow 'naked'. I've rounded datepicker's appearence in red.
Its configuraition is:
<?php $form->widget ('ext.CJuiDateTimePicker.CJuiDateTimePicker',
array (
'attribute'=>'start',
'model'=>$model,
'value' => $model->start,
'language' => 'en',
'options'=>array (
// 'timeFormat'=>strtolower(Yii::app()->locale->timeFormat),
'showSecond'=>true,
),
)
); ?>
How to fix it? Am i missing some skin files? How to get them?
I use bootstrap theme FYI.
This is a styling issue .
Download correct Style.css file it will show datepicker correctly .
The issue was that in the Yii app development i was using the NlsClientScript Yii Extention for preventing duplicate scripts loading. So, the datatimepicker's css file has not been loaded into the current nlsXXXXXXX.css file. It turned that this NlsClientScript does manage/aggregate the css files load, the docs saying opposite though...
From documentation:
The extension does not prevent the multiple loading of CSS files.
So I've found the corresponding file, deleted it and reloaded the app.
From documentation:
The extension doesn't watch wether a js/css file has been changed. If you set the merge functionality and some file changed, you need to delete the cached merged file manually, otherwise you'll get the old merged one.
I have this requirement where I have to change the default styles on my Ext JS application. I am not talking about changing stuff in CSS files yet. I am not that ambitious yet. Here is what I am looking for:
Suppose I need a Submit and Cancel buttons, I use xtype:button and text:Save ( or Cancel ). This will render buttons with the text on them. What should I do if I want to change the look and feel of the button? Or replace the button with a cool Save or Cancel image?
Right now I have all the texts on the application with the default font that ExtJS shows. What am I supposed to do if I want all the text on the application changed to a different font? Everything right from the data in forms/grids and the titles of each component should be changed to some other font my customer prefers. What am I supposed to do?
I understand these are very basic and a generic questions, but I am looking for a good headsup before I proceed with my task.
Thank you all in advance. Waiting for answers :)
Update: So, I found out how we deal with CSS and change the fonts. Can anyone help about the Chaning the look and feel for Submit/Cancel buttons.
I recommend you to use SASS and compass to build your own themes, or better said to change one the existing themes. In the Ext JS documentation you can find the css variables which you can set according to your needs.
If you are not ready for theming with SASS just yet take a look at this example of button configs from the sencha docs:
Stanadalone Example page: http://docs.sencha.com/extjs/4.1.3/extjs-build/examples/button/button.html
CSS that adds customized images to the buttons: http://docs.sencha.com/extjs/4.1.3/extjs-build/examples/button/button.css
JS that shows button configs: http://docs.sencha.com/extjs/4.1.3/extjs-build/examples/button/button.js
Essentially this shows how to use iconCls property on the button config along with a simple CSS class to add desired image to your button.
i installed the extension jpCarousel in Typo3 and want to add a slideshow. I changed nothing at the template css file of jpCarousel, but the container is not in the same position like the red div, which also is a div of the extension...
can anyone help me, and tell how i can adjust the galerie to the red div?
thanks!
http://preview-list.lmenges.de/index.php?id=auto
greetings!
Optimize your CSS, for an example width of #content_left causes moving content of right column down. Use some inspector in your browser to make it correctly, for now you have there a quite big mess.